zoukankan      html  css  js  c++  java
  • 监测屏幕宽度

    <!DOCTYPE html>
    <html lang="en">
        <head>
            <meta charset="utf-8">
        </head>
        <body>
        </body>
    </html>
    <script>
        function client() {
            if(window.innerWidth != null)  // ie9 +  最新浏览器
            {
                return {
                    window.innerWidth,
                    height: window.innerHeight
                }
            }
            else if(document.compatMode === "CSS1Compat")  // 标准浏览器
            {
                return {
                    document.documentElement.clientWidth,
                    height: document.documentElement.clientHeight
                }
            }
            return {   // 怪异浏览器
                document.body.clientWidth,
                height: document.body.clientHeight

            }
        }
        reSize();//(带有括号只调用一次)先调用一次
        window.onresize = reSize;//页面改变才会发生


        function reSize(){
            var clientWidth = client().width;
            if (clientWidth >960){
                document.body.style.backgroundColor = "red";
            }else if(clientWidth < 640){
                document.body.style.backgroundColor = "yellow";
            }else{
                document.body.style.backgroundColor = "blue";

            }
        }
    </script>

  • 相关阅读:
    4月份学习计划
    windows下下载安装python、 pip、nose
    Windows下怎么搭建Python+Selenium的自动化环境
    pthon之异常、文件练习题
    python 元组 字符串 字典 列表嵌套练习题1
    硬件访问服务AIDL JNI 方式
    Android 加载图片优化(二) LruCache DiskLruCache
    Android 加载图片优化(一)
    ubuntu 下 4412烧写SuperBoot
    metro WCF
  • 原文地址:https://www.cnblogs.com/water-wf/p/10949335.html
Copyright © 2011-2022 走看看