关于iframe中使用fixed定位的一些问题

2018-10-03 17:56:12来源:博客园 阅读 ()

新老客户大回馈,云服务器低至5折

先来看看position: fixed;的定义:生成绝对定位的元素,相对于浏览器窗口进行定位;

但是在iframe中使用fixed定位,实际上是相对于iframe窗口进行定位,原因在于iframe类似于创建了一个浏览器窗口,在使用一些获取鼠标位置以及元素位置等方法的时候把iframe当作浏览器窗口来处理就行。

以下是一些在iframe中使用fixed需要考虑的常用js事件对象属性与方法:

获取鼠标的位置:

    e.clientY // 获取鼠标在浏览器视窗的Y坐标,在iframe中相对于iframe窗口

    e.screenY  // 获取的是鼠标相对于屏幕的上边距,不考虑iframe因素,

获取元素的偏移量:

    var position = Object.getBoundingClientRect();  //用于获取某个元素相对于浏览器视窗的位置集合,在iframe中相对于iframe视窗

      position.top  //获取元素 "顶部" 距离浏览器视窗 "顶部" 的距离

      position.bottom  //获取元素 "底部" 距离浏览器视窗 "顶部" 的距离

      position.left //获取元素 "左侧" 距离浏览器视窗 "左侧" 的距离

      position.right  //获取元素 "右侧" 距离浏览器视窗 "左侧" 的距离

   Object.offsetTop  //获取元素距离 最近含有 ”定位“ 属性标签左侧的距离

标签:

版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有

上一篇:CSS的再深入2(更新中···)

下一篇:弹性盒模型--新版与旧版比较(2)