最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - Why does window.screen not work on macOS safari - Stack Overflow

programmeradmin2浏览0评论

So I'm trying to redirect mobile pages on my website. If someone is on a mobile device then it would send them to the mobile site rather than the desktop site. It works on Chrome. However, it is not working on macOS Safari. Any idea why? The JavaScript is below:

<script>
        if (screen.width <= 420) {
        document.location="mobileindex.html";
    }
</script>

So I'm trying to redirect mobile pages on my website. If someone is on a mobile device then it would send them to the mobile site rather than the desktop site. It works on Chrome. However, it is not working on macOS Safari. Any idea why? The JavaScript is below:

<script>
        if (screen.width <= 420) {
        document.location="mobileindex.html";
    }
</script>
Share Improve this question edited Mar 2, 2018 at 21:55 toastrackengima 8,7624 gold badges53 silver badges62 bronze badges asked Mar 2, 2018 at 21:38 Gib CannonGib Cannon 531 silver badge7 bronze badges
Add a ment  | 

1 Answer 1

Reset to default 10

screen.width returns the width of the screen, not the browser window. This is good as it means that we can't falsely redirect users to the mobile site.

In Chrome, we can test that our logic works using the Device Emulator. When a page is loaded in the Device Emulator, screen.width returns the width of the device being emulated, rather than the host puter's screen.

However, in Safari, the corresponding Responsive Design Mode does not work this way. screen.width will always return the width of the puter monitor in Safari, not the width of the emulated device.

In other words, this is a problem with Safari's implementation, not your code. It will work fine on an actual mobile device.

发布评论

评论列表(0)

  1. 暂无评论