關於iframe中使用fixed定位的一些問題

先來看看position: fixed;的定義:生成絕對定位的元素,相對於瀏覽器窗口進行定位;瀏覽器

可是在iframe中使用fixed定位,其實是相對於iframe窗口進行定位,緣由在於iframe相似於建立了一個瀏覽器窗口,在使用一些獲取鼠標位置以及元素位置等方法的時候把iframe看成瀏覽器窗口來處理就行。對象

如下是一些在iframe中使用fixed須要考慮的經常使用js事件對象屬性與方法:事件

獲取鼠標的位置:get

    e.clientY // 獲取鼠標在瀏覽器視窗的Y座標,在iframe中相對於iframe窗口iframe

    e.screenY  // 獲取的是鼠標相對於屏幕的上邊距,不考慮iframe因素,it

獲取元素的偏移量:io

    var position = Object.getBoundingClientRect();  //用於獲取某個元素相對於瀏覽器視窗的位置集合,在iframe中相對於iframe視窗cli

      position.top  //獲取元素 "頂部" 距離瀏覽器視窗 "頂部" 的距離方法

      position.bottom  //獲取元素 "底部" 距離瀏覽器視窗 "頂部" 的距離top

      position.left //獲取元素 "左側" 距離瀏覽器視窗 "左側" 的距離

      position.right  //獲取元素 "右側" 距離瀏覽器視窗 "左側" 的距離

   Object.offsetTop  //獲取元素距離 最近含有 」定位「 屬性標籤左側的距離

相關文章
相關標籤/搜索