jquery redirect on screen width and device rotation

Question

I have a site that needs to show the main website for screen widths down to 480, then switch to a mobile site. The original site is too tough to reverse responsive so this is what I came up with and it works, except it needs to be improved because it doesnt react to the rotation of the device. On large phones in landscape the main site should show and then back to the mobile in portrait. Everything I have tried has broken what I do have working. Any ideas how to modify this to react to device rotation, would be much appreciated.

<script type="text/javascript">
    $(document).ready(function(){
        if($(window).width() < 480){
            window.location = "http://mobile"
        }
    });
</script>

score 1 · Accepted Answer · answered Jul 19 '12 at 02:50

1

<script type="text/javascript">
    $(window).on('load resize',function(){
        if($(window).width() < 480){
            window.location = "http://mobile"
        }
    });
</script>

Add you DOM ready binding as well if you want to redirect before loading all resourses

answered Jul 19 '12 at 02:50

sabithpocker

15,274
1
42
75

Thank you, worked perfect. Yes, if this method is to work, it still needs some polishing. – John Jul 19 '12 at 03:13
May I suggest that you use `window.location.replace("http://mobile")` instead of window.location. It plays better with browser history for this sort of redirect. – Mere Development Oct 25 '12 at 10:21

score 0 · Answer 2 · edited May 23 '17 at 11:48

0

see the first answer of this post. i think you need a different window.location command.

How to redirect to another webpage in JavaScript/jQuery?

edited May 23 '17 at 11:48

Community

1
1

answered Jul 19 '12 at 02:42

colonelclick

2,165
2
24
33

jquery redirect on screen width and device rotation

2 Answers2