zoukankan      html  css  js  c++  java
  • 屏幕尺寸发生变化时页面自适应

    $(window).resize(function(){
        var wH = window.innerHeight;
        var h = $(".content-item").height();
        console.log(wH);
        if(h<wH){
            $(".content-item").height(wH-60);
            $(".siderbar").height(wH);
            console.log($(".content-item").height());
        }else{
            $(".siderbar").height(h);
        }
       location.reload()
    
    });

    Window 尺寸

    有三种方法能够确定浏览器窗口的尺寸(浏览器的视口,不包括工具栏和滚动条)。

    对于Internet Explorer、Chrome、Firefox、Opera 以及 Safari:

    • window.innerHeight - 浏览器窗口的内部高度
    • window.innerWidth - 浏览器窗口的内部宽度

    Window Screen

    window.screen 对象在编写时可以不使用 window 这个前缀。

    一些属性:

    • screen.availWidth - 可用的屏幕宽度
    • screen.availHeight - 可用的屏幕高度

    Window Screen 可用宽度

    screen.availWidth 属性返回访问者屏幕的宽度,以像素计,减去界面特性,比如窗口任务栏。

  • 相关阅读:
    1113 Integer Set Partition
    1114 Family Property
    1115 Counting Nodes in a BST
    1116 Come on! Let's C
    Maven 常用命令
    Maven 快照
    Maven 插件
    Maven POM
    Maven 中央仓库
    Maven 依赖机制
  • 原文地址:https://www.cnblogs.com/linsx/p/6999936.html
Copyright © 2011-2022 走看看