首页 > 其他 > 详细

放大镜功能准备工作

时间:2018-01-18 15:28:46      阅读:191      评论:0      收藏:0      [点我收藏+]

知识点

  1. 网页被卷起来的高度/宽度(即浏览器滚动条滚动后隐藏的页面内容高度)

    document.documentElement.scrollTop和document.documentElement.scrollLeft

  2. 网页工作区域的高度和宽度

    document.documentElement.clientHeight和document.documentElement.clientWidth

  3. 元素距离文档顶端和左边的偏移值

    DOM元素对象.offsetTop和 DOM元素对象.offsetLeft

其中对于偏移量的属性:

  • offsetParent:当前对象的上级层对象
  • offsetTop:当前对象到其上层顶部(offsetParent)的距离,不能赋值,如果需要设置对象到页面顶部的距离要用style.top (offsetLeft同理)
  • offsetWidth:当前对象的宽度 offsetHeight:当前对象的高度

    它与style.width的区别是: 如果宽度为百分比时, style.width返回的是百分比,而offsetWidth返回的是具体的数值 (offsetHeight同理)

    获取网页元素的绝对位置:

javascript getElementTop(element) { var actualTop = element.offsetTop; var current = element.offsetParent; while (current !== null) { actualTop += current.offsetTop; current = current.offsetParent; } return actualTop; }

 `getElementLeft(element){

    var actualLeft = element.offsetLeft;
    var current = element.offsetParent;
    while (current !== null){
      actualLeft += current.offsetLeft;
      current = current.offsetParent;
    }
    return actualLeft;
  }`

放大镜功能准备工作

原文:https://www.cnblogs.com/wudandan/p/8310250.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!