判斷一個(gè)元素是否出現(xiàn)在窗口可視范圍(瀏覽器的上邊緣和下邊緣之間赫粥,肉眼可視)龟劲。
function isVisiblie($node){
var windowH = $(window).height(),
scrollT = $(window).scrollTop(),
offsetT = $node.offset().top,
nodeH = $node.height();
if(windowH + scrollT > offsetT && scrollT < offsetT + nodeH ){
return true;
}else{
return;
}
}
當(dāng)窗口滾動(dòng)時(shí)胃夏,判斷一個(gè)元素是不是出現(xiàn)在窗口可視范圍。每次出現(xiàn)都在控制臺(tái)打印 true 昌跌。
function logVisible($node){
$(window).on('scroll',function(){
var scrollTop = $(this).scrollTop(),
winH = $(this).height(),
top = $node.offset().top;
if (scrollTop+winH>top) {
console.log('true');
}
})
}
logVisible($('div'));
當(dāng)窗口滾動(dòng)時(shí)仰禀,判斷一個(gè)元素是不是出現(xiàn)在窗口可視范圍。在元素第一次出現(xiàn)時(shí)在控制臺(tái)打印true蚕愤,以后再次出現(xiàn)不做任何處理答恶。
var hadshow = false;
$(window).on('scroll',function(e){
var $ct = $('.show');
if(!hadshow && isVisiblie($ct) ){
console.log(true);
hadshow = true;
}
});
function isVisiblie($node){
var windowH = $(window).height(),
scrollT = $(window).scrollTop(),
offsetT = $node.offset().top,
nodeH = $node.height();
if(windowH + scrollT > offsetT && scrollT < offsetT + nodeH ){
return true;
}else{
return;
}
}
實(shí)例
pic
news
最后編輯于 :
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者