• 标准模式和混杂模式下浏览器的可视区域的宽高问题


    利用document.compatMode可以用来判断浏览器的模式是标准模式还是混杂模式,

    (1)       CSS1Compat表示的是标准模式

    (2)       BackCompat表示的是混杂模式

    不同的模式获取宽高的方式是不一样的,为了兼容一般要么对浏览器的工作模式加以判断严要么则是利用利用||运算兼容

    标准模式:

    document.documentElement.clientHeight
    document.documentElement.clientWidth//浏览器可是区域的宽高
    document.documentElement.scrollTop
    document.documentElement.scrollLeft//浏览器滚轴滚动的距离

    混杂模式:不写DOCTYPE的声明

      document.body.clientHeight
      document.body. clientWidth//浏览器可是区域的宽高
    document. body.scrollTop
    document. body.scrollLeft//浏览器滚轴滚动的距离

    同时除了IE 8 及 更早 IE 版本不支持该属性,所有其他的主流浏览器均将信息放入到window上,支持一下方式属性

    window.innerHeight
    window.innerWidth//浏览器可是区域的宽高
    window.pageXOffset
    window.pageYOffset//浏览器滚轴滚动的距离

    在主流浏览器中可以直接使用Window的范式获取相关的宽高

    offsetWidth:元素自身的宽度包括width+border+padding不包含margin的值

    offsetHeight:同理

    offsetLeft:元素左侧相对于其父元素的左内边距的距离

    offsetTop:同理两者均包含元素自身的margin

  • 相关阅读:
    Android-fragment-ListView展示-v4支持包
    Android-fragment的替换-V4支持包
    Android-fragment的替换
    Jenkins安装与使用(CentOS6.5)
    在tlog里统计注册统计相关功能
    通过t_log文件计算次日留存
    第九章练习
    练习
    python2.7安装完后,执行python时,出现import readline ImportError: No module named readline 以及tab补全
    (转)时间同步介绍
  • 原文地址:https://www.cnblogs.com/heshan1992/p/6735751.html
Copyright © 2020-2023  润新知