redirection based on browser size

Question

I am trying to re-direct my web site viewers to one of two pages, based on browser size. I want regular browsers (and iPads) to stay on the page that the viewer is entering, which for examples sake would be:

 http://www.testing.com/getstarted.html

But if they are on a mobile phone browser, let's say less than 700 pixels, I want them re-directed to this page:

 http://www.testing.com/mobilegetstarted.html

I have tried using this script in the head area, but it does not redirect my phone - it just hangs. Can anyone please help me fix this?

<script type="text/javascript">
<!--
if (screen.width <= 700) {
document.location = "mobilegetstarted.html";
}
//-->
</script>

I have also tried adding the url these ways:
http://testing.com/mobilegetstarted.html and

 http://www.testing.com/mobilegetstarted.html

but that doesn't work either. Any clues how to make the re-direct work?

Gary

Answer 1

document.location is read only.

You should use window.location.assign.

So, use:

<script type="text/javascript">
if (screen.width <= 700) {
    window.location.assign("mobilegetstarted.html");
}
</script>