How to get the real screen size(screen resolution) by using js

获取用户屏幕的真实像素分辨率, 屏幕实际尺寸

window.devicePixelRatio

设备像素比

screen resolution

屏幕分辨率

function getResolution() {
const realWidth = window.screen.width * window.devicePixelRatio;
const realHeight = window.screen.height * window.devicePixelRatio;
console.log(`
Your screen resolution is: ${realWidth} x ${realHeight}
Your screen devicePixelRatio is: ${window.devicePixelRatio}
`);
} // test
getResolution();
// Your screen resolution is: 3840 x 2160

retina screen bug

视网膜屏幕错误

refs

https://stackoverflow.com/questions/65462643/how-to-get-the-real-screen-sizescreen-resolution-by-using-js/65463713#65463713



xgqfrms 2012-2020

www.cnblogs.com 发布文章使用:只允许注册用户才可以访问!


How to get the real screen size(screen resolution) by using js的更多相关文章

  1. iPhone 6 Screen Size and Web Design Tips

    Apple updated its iPhone a bit ago making the form factor much bigger. The iPhone 6 screen size is b ...

  2. iPhone screen size

      iPhone 4 iPhone 5 iPhone 6 iPhone 6 Plus Display Size 3.5 in 4 in 4.7 in 5.5 in Screen Size 320 x ...

  3. js screen size check

    js screen size check js 屏幕尺寸检测 window.screen API screen; window.screen.width; window.screen.height; ...

  4. screen.height && screen.width

    screen.height && screen.width how to get window max width in js screen.height; screen.width; ...

  5. JS window对象 screen对象 screen对象用于获取用户的屏幕信息。 语法: window.screen.属性

    screen对象 screen对象用于获取用户的屏幕信息. 语法: window.screen.属性 对象属性:

  6. 1. Change the emulator screen size

    1. "Windows" ==> "Android Virtual Device Manager" ==> Select one emulator ...

  7. ABAP:区别CALL SCREEN/SET SCREEN/LEAVE TO SCREEN

    1,CALL SCREEN XXXX将在Screen调用栈(CALL STACK)上面添加一层调用(进栈),调用XXXX的PBO和PAI,如果XXXX的Next Screen不为0,那么将继续其Nex ...

  8. 区别CALL SCREEN/SET SCREEN/LEAVE TO SCREEN

    分类: 1,CALL SCREEN XXXX将在Screen调用栈(CALL STACK)上面添加一层调用(进栈),调用XXXX的PBO和PAI,如果XXXX的Next Screen不为0,那么将继续 ...

  9. javascript_获取浏览器属性

    navigator.appName:浏览器名称: navigator.appVersion:浏览器版本: navigator.language:浏览器设置的语言: navigator.platform ...

随机推荐

  1. Vue 标签Style 动态三元判断绑定

    <div  :style=" 1==1 ? 'display:block' : 'display:none' "></div> v-bind:style 的 ...

  2. 深度学习论文翻译解析(十七):MobileNets: Efficient Convolutional Neural Networks for Mobile Vision Applications

    论文标题:MobileNets: Efficient Convolutional Neural Networks for Mobile Vision Applications 论文作者:Andrew ...

  3. Fixing SQL Injection: ORM is not enough

    Fixing SQL Injection: ORM is not enough | Snyk https://snyk.io/blog/sql-injection-orm-vulnerabilitie ...

  4. Spring听课笔记(tg)2

    配置Bean -- 配置形式:基于XML 文件的方式, 基于注解的方式 -- Bean的配置方式:通过全类名(反射).通过工厂方法(静态工厂方法&实例工厂方法).FactoryBean -- ...

  5. Nginx配置WebSocket反向代理(Tomcat+Nginx)

    @toc WebSocket 和HTTP协议不同,但是WebSocket中的握手和HTTP中的握手兼容,它使用HTTP中的Upgrade协议头将连接从HTTP升级到WebSocket.这使得WebSo ...

  6. Geoserver+Openlayers+MySQL设计思想,GeoServer服务器搭建(Docker构建镜像)

    Geoserver+Openlayers+MySQL设计思想,GeoServer服务器搭建(Docker构建镜像) 一.geoserver+openlayers+mysql主要设计思想 1.1 Geo ...

  7. 《》——8幅图图解Java机制

    String对象不可改变的特性 String s = "abcd"; s = s.concat"ef"; equals()与hashCode()方法协作约定 H ...

  8. 网页开发(HTML 基础)

    网页的标准是W3C,目前模式是HTML.CSS和JavaScript. HTML,全称"Hyper Text Markup Language(超文本标记语言)",简单来说,网页就是 ...

  9. cachedThreadPool缓存线程池

    package com.loan.modules.common.util; import java.util.concurrent.BlockingQueue; import java.util.co ...

  10. Git轻松入门2:分支篇

    什么是分支 在玩剧情类游戏时,不同的选择会触发不同的剧情路线,每条剧情路线都会独立发展,最终走向不同的结局. Git中所谓的"分支(branch)"就如同游戏中的剧情路线,用户可以 ...