how to get window width in javascript

how to get window width in js

How to Detect Screen Resolution with JavaScript

window

https://developer.mozilla.org/en-US/docs/Web/API/window/innerWidth

https://www.w3schools.com/jsref/prop_win_innerheight.asp

function innerFunction() {
var w = window.innerWidth;
var h = window.innerHeight;
document.getElementById("demo").innerHTML = "Width: " + w + "<br>Height: " + h;
} function outerFunction() {
var w = window.outerWidth;
var h = window.outerHeight;
document.getElementById("demo").innerHTML = "Width: " + w + "<br>Height: " + h;
}

screen

https://stackoverflow.com/questions/3437786/get-the-size-of-the-screen-current-web-page-and-browser-window


window.screen.height;
window.screen.width;

viewport size / device size / document size

https://ryanve.com/lab/dimensions/


responsive viewport / viewbox

svg viewbox

small screen

const svgStr = `
<svg data-uuid="live_map_svg" id="live_map_svg" width="100%" height="100%" viewBox="0 0 1000 1000" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"></svg>
`; body.insertAdjacentHTML(`beforeend`, svgStr.trim());


https://www.tutorialrepublic.com/faq/how-to-detect-screen-resolution-with-javascript.php

https://usefulangle.com/post/190/javascript-window-width-height


how to get window width in javascript的更多相关文章

  1. $(window).width() is not a function

    昨天在帮同事调试JS的时候,FF报错了,$(window).width() is not a function.我以前也是这么用的,都没问题,为什么现在就报错了呢? 这是因为jQuery用" ...

  2. JavaScript window.open()属性

    一. Window 对象 Window 对象是 JavaScript 层级中的顶层对象. Window 对象代表一个浏览器窗口或一个框架. Window 对象会在 <body> 或 < ...

  3. JavaScript—window对象使用

    window对象是JavaScript浏览器对象模型中的顶层对象,包含多个常用方法和属性: 1. 打开新窗口 window.open(pageURL,name,parameters) 其中:pageU ...

  4. JavaScript权威指南--window对象

    知识要点 window对象及其客户端javascript所扮演的核心角色:它是客户端javascript程序的全局对象.本章介绍window对象的属性和方法,这些属性定义了不同的API,但是只有一部分 ...

  5. JavaScript浏览器对象模型(BOM)之window对象

    一.BOM概述 BOM(Browser Object Model)浏览器对象模型,它提供了很多对象,用于访问浏览器的功能. BOM 缺少规范,每个浏览器提供商又按照自己想法去扩展它,那么浏览器共有对象 ...

  6. javascript之Window 对象

    一.说明:他是JS中最大的对象,它描述的是一个浏览器窗口,一般要引用他的属性和方法时,不需要用“Window.XXX”这种形式,而是直接使用“XXX”.一个框架页面也是一个窗口. 二.Window窗口 ...

  7. JavaScript (JS)基础:BOM 浅析 (含window对象相关基本方法、属性解析)

    ① window对象(Math方法也属于window对象): window对象是JavaScript中的顶级对象,所有定义在全局作用域中的变量.函数都会变成window对象的属性和方法,window对 ...

  8. jQuery,javascript获得网页的高度和宽度$(document).height / $(window).height

    一.javascript 网页可见区域宽: document.body.clientWidth 网页可见区域高: document.body.clientHeight 网页可见区域宽: documen ...

  9. JavaScript window

    window -- window对象是BOM中所有对象的核心 window,中文"窗口" window对象除了是BOM中所有对象的父对象外,还包含一些窗口控制函数 全局的windo ...

随机推荐

  1. Service Mesh 在百度网盘数万后端的落地实践

    https://www.infoq.cn/article/vpa6aypkizuqiijzflih

  2. FFT,NTT 笔记

    FFT 简介 FFT是干啥的?它是用来加速多项式乘法的.我们平时经常求多项式乘法,比如\((x+1)(x+3)=(x^2+4x+3)\).假设两个式子都是\(n\)项(不足的补0),那朴素的算法是\( ...

  3. 获取本机IP和主机名

    如果是在windows环境: 使用InetAddress.getLocalHost()方法即可 package com.datongsoft.wg.common.util; import java.n ...

  4. 封装SpringJdbcTemplate

    package com.jy.modules.cms.query; import java.util.List; import java.util.Map; public interface quer ...

  5. 设计模式(三)——Java工厂方法模式

    工厂方法模式 1 看一个新的需求 披萨项目新的需求:客户在点披萨时,可以点不同口味的披萨,比如 北京的奶酪 pizza.北京的胡椒 pizza 或者是伦敦的奶酪 pizza.伦敦的胡椒 pizza. ...

  6. dsu on tree ——附带buff的暴力解法

    这篇博客只是简单叙述思想(因为ML太弱了),具体例题请转其他博客. dsu on tree,许多OI将其归于启发式合并,当然如果你能理解更好,这只是一个理解方式罢了. 思想简述 顾名思义,这个算法是处 ...

  7. CF-gym/101810 J、T-Shirts Dilemma

    题目链接:点我 题意: 给你一个区间[a,b],让你从里面选一个连续子区间[x,y](子区间可以为[a,b]),把这个区间的所有数或起来x|x+1|x+2|...|y 你要使得区间[x,y]异或起来的 ...

  8. zjnuSAVEZ (字符串hash)

    Description There are eight planets and one planetoid in the Solar system. It is not a well known fa ...

  9. hdu2825 Wireless Password(AC自动机+状压dp)

    Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others) Total Submission ...

  10. Codeforces #6241 div2 C. Orac and LCM (数学)

    题意:给你一个数列,求所有子序列对的\(lcm\),然后求这些所有\(lcm\)的\(gcd\). 题解:我们对所有数分解质因数,这里我们首先要知道一个定理: ​ 对于\(n\)个数,假如某个质数\( ...