js 判斷進入可視區域

2021-09-25 04:53:15 字數 522 閱讀 7108

1.使用場景

2.**實現

/*

* * 監聽網頁滾動事件 */

$(window).scroll(

function

()

});

拓展:

//

獲取指定元素距離網頁左上角(0,0)的縱向偏移距離

//該值會隨著滾動條的變化而變化:scrolltop變大,該值變小;scrolltop變小,該值變大

document.getelementbyid('#id').getboundingclientrect().top;

value = 網頁可視區域高度 - 元素距離網頁頂部

1.當網頁可視區域高度》=元素距離網頁頂部時,說明該元素進入可視區域

2.計算可視距離:當value<0時,表示的是該元素差多少畫素可以被看到(可視距離 = -value)

3.計算可視高度:當value>0時,表示的是該元素的可視高度(該元素可以被看到的高度)(可視距離 = value)

元素進入可視區域執行

doctype html html lang en head meta charset utf 8 title title title style show show keyframes loading to style head body p id show p script newclassna...

如何判斷元素是否在可視區域ViewPort

個性簽名 生如夏花,逝如冬雪 人生如此,何悔何怨。前言 經常需要計算元素的大小或者所在頁面的位置,offsetwidth,clientwidth,scrollwidth,scrolltop這幾個關鍵字的出現更是家常便飯,每次碰到都需要事先實驗一番。為了下次開發提高效率。在這裡一次性做個總結,以用來判...

JS獲取瀏覽器可視區域尺寸

本文所說的是瀏覽器視窗的可視區域大小,不是瀏覽器視窗大小,也非頁面尺寸。在沒有宣告doctype的ie中,瀏覽器顯示視窗大小只能以下獲取 document.body.offsetwidth document.body.offsetheight在宣告了doctype的瀏覽器中,可以用以下來獲取瀏覽器顯...