如何获取windowWidth、windowHeight、pageWidth、pageHeight、screenWidth、screenHeight、pageX、pageY、screenX、screenY,这些都可以在所有主要浏览器中使用?


当前回答

使用“控制台”或单击“检查”后,检查任何网站当前加载页面的高度和宽度。

步骤1:单击鼠标右键,单击“检查”,然后单击“控制台”

步骤2:确保您的浏览器屏幕不应处于“最大化”模式。如果浏览器屏幕处于“最大化”模式,您需要首先单击最大化按钮(位于右上角或左上角),然后取消最大化。

步骤3:现在,在大于号('>')后面写以下内容,即。

       > window.innerWidth
            output : your present window width in px (say 749)

       > window.innerHeight
            output : your present window height in px (say 359)

其他回答

这里是一个纯JavaScript的跨浏览器解决方案(源代码):

var width = window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;

var height = window.innerHeight
|| document.documentElement.clientHeight
|| document.body.clientHeight;

获取可用屏幕维度的非jQuery方法。window.screen.width/height已经发布,但为了响应Web设计和完整性,我认为值得提及这些属性:

alert(window.screen.availWidth);
alert(window.screen.availHeight);

http://www.quirksmode.org/dom/w3c_cssom.html#t10 :

availWidth和availHeight-屏幕(不包括OS任务栏等)。

这是我的解决方案!

//内部宽度常量screen_viewport_inner=()=>{设w=窗口,i=“内部”;if(!(窗口中的`innerWidth`)){i=“客户端”;w=document.documentElement | | document.body;}返回{width:w[`${i}宽度`],高度:w[`${i}高度`]}};//外侧宽度常量screen_viewport_outer=()=>{设w=窗口,o=“外部”;if(!(窗口中的`outerWidth`)){o=“客户端”;w=document.documentElement | | document.body;}返回{width:w[`${o}宽度`],高度:w[`${o}高度`]}};//样式常量console_color=`颜色:rgba(0255,0,0.7);字体大小:1.5rem;边框:1px纯红色;`;//测试常量测试=()=>{让i_obj=screen_viewport_inner();console.log(`%c screen_viewport_inner=\n`,console_color,JSON.stringfy(i_obj,null,4));让o_obj=screen_viewport_out();console.log(`%c screen_viewport_outer=\n`,console_color,JSON.stringify(o_obj,null,4));};//生命(() => {测试();})();

图形答案:(............)

这就是我如何在React JS项目中获得屏幕宽度的方法:

如果宽度等于1680,则返回570,否则返回200

var screenWidth = window.screen.availWidth;

<Label style={{ width: screenWidth == "1680" ? 570 : 200, color: "transparent" }}>a  </Label>

屏幕有效宽度