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


先來看看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  //獲取元素距離 最近含有 ”定位“ 屬性標簽左側的距離


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM