在使用不同的手举行的浏览器/智能设备时，屏幕宽度问题 [英] Screen Width Issue when using different browsers on Hand Held/Smart Devices

问题描述

我已经做了发言，我正在检测的移动浏览器的脚本，当其真，那么JS功能的getWidth 被称为和访问者重定向到某个网址他的设备的屏幕宽度的基础。
我使用的检测基本的js方法即 screen.width 来检测屏幕宽度

I have made a script in which i am detecting the the mobile browser and when its true then the JS function getwidth being called and redirects the visitor to a certain URL on the basis of his device's screen width. I used basic js method of detection i.e screen.width to detect screen width

我面临的问题是不同的屏幕宽度就是用不同的browsers.Like回来时，我有一个平板电脑（Android版4.0.3），其实际屏幕宽度为800 PX，当我用默认的浏览器上运行我的脚本然后返回准确的屏幕宽度 800像素但是当我用不同的浏览器打开它，然后他们回到像UC浏览器不同的宽度将返回740 PX（问题2：也为onload功能，当我试图在UC浏览器返回屏幕宽度则返回屏幕宽度为0像素和页面加载后，当我调用同一个函数再然后返回宽度= 740px ），当我运行脚本在Opera Mini上则返回宽度441像素。

The problem i am facing is that different screen width is being returning in different browsers.Like I have a tablet (Android 4.0.3) whose actual screen width is 800 PX and when i run my script on it by the default browser then it returns accurate screen width 800px but when I open it with different browsers then they return different widths like UC Browser is returning 740 PX (ISSUE 2: also when onload function i tried to return screen width on UC browser then it returns screen width as 0px and after page load when i call the same function again then it returns width=740px) , when i run script on Opera Mini then it returns width as 441 PX.

请让我知道这是检测举行/智能设备之手的屏幕宽度的最有效方式。所以，我可以使重定向完美屏幕宽度的基础上。

Kindly let me know which is the most efficient way to detect the screen width of Hand Held/Smart Devices. So i can make the redirection perfectly on the basis of screen width.

URL进行测试： http://radiations3.aiksite.com/home.html

谢谢，

推荐答案

嗯，这听起来像你对我不应该使用JavaScript，而是使用CSS。你看着媒体查询的？这是最跨浏览器的方法来检测屏幕的宽度，然后相应地提供了不同的风格。

Hmm, it sounds to me like you shouldn't use Javascript, but rather use CSS. Have you looked into media queries? This is the most cross-browser way to detect the width of a screen and then offer a different style accordingly.

如果你不希望改变风格，但重定向像你说的（如果必须），那么我建议以下code（代表的Andy兰顿）：

If you're not looking to change styles, but redirect as you say (if you must), then I'd suggest the following code (on behalf of Andy Langton):

var w=window,d=document,e=d.documentElement,g=d.getElementsByTagName('body')[0],x=w.innerWidth||e.clientWidth||g.clientWidth,y=w.innerHeight||e.clientHeight||g.clientHeight;

这是将创建两个变量的简写， X 和是，分别是宽度和高度。也许，这更像是你在找什么，但我会建议先检查出媒体查询，并确保你正在寻找做不能用CSS做什么。有没有保证，JavaScript是在任何浏览器启用。

This is the shorthand which will create two variables, x and y, which are width and height respectively. Perhaps this is more like what you're looking for, but I'd first suggest checking out media queries and make sure what you're looking to do can't be done with CSS. There's no guarantee that Javascript is enabled in any browser.

这篇关于在使用不同的手举行的浏览器/智能设备时，屏幕宽度问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！