jquery懶加載、回到頂部

  • 如何判斷一個元素是否出現(xiàn)在窗口可視范圍(瀏覽器的上邊緣和下邊緣之間,肉眼可視)。寫一個函數(shù) isVisible實現(xiàn)
    function isVisible($node){
    var curHigh = $node.offset().top,
    winTop = $(window).scrollTop(),
    winHigh = $(window).height();
    if(winTop + winHigh > curHigh && winTop < curHigh){
    return true;
    }else{
    return false;
    }
    }
  • 當窗口滾動時,判斷一個元素是不是出現(xiàn)在窗口可視范圍。每次出現(xiàn)都在控制臺打印 true 。用代碼實現(xiàn)
    $(window).on('scroll',function(){
    if(isVisible($node)){
    console.log('true')
    }
    })
    代碼預覽
  • 當窗口滾動時,判斷一個元素是不是出現(xiàn)在窗口可視范圍。在元素第一次出現(xiàn)時在控制臺打印 true,以后再次出現(xiàn)不做任何處理。用代碼實現(xiàn)
    $(window).on('scroll',function(){
    if($('.green').data('condition')){return}
    if(isVisible($node)){
    console.log('true');
    $node.data('condition','true');
    }
    });
    代碼預覽
  • 圖片懶加載的原理是什么?
    • 懶加載即曝光加載,當圖片曝光在你眼前的時候再去加載。
      如果網(wǎng)頁中有較多圖片,為優(yōu)化渲染速度,圖片可以先使用一張占位圖片顯示,真實的圖片地址保存在一個自定義的屬性當中,當圖片出現(xiàn)在窗口的可是范圍的時候,才將真實的地址替換掉占位圖片的地址
最后編輯于
?著作權歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內(nèi)容

  • 如何判斷一個元素是否出現(xiàn)在窗口可視范圍(瀏覽器的上邊緣和下邊緣之間,肉眼可視)。寫一個函數(shù) isVisible實現(xiàn)...
    coolheadedY閱讀 465評論 0 0
  • Q&A: 1. 如何判斷一個元素是否出現(xiàn)在窗口可視范圍(瀏覽器的上邊緣和下邊緣之間,肉眼可視)。寫一個函數(shù) isV...
    進擊的阿群閱讀 476評論 0 3
  • 問答 1、如何判斷一個元素是否出現(xiàn)在窗口可視范圍(瀏覽器的上邊緣和下邊緣之間,肉眼可視)。寫一個函數(shù)isVisib...
    StarLikeRain閱讀 223評論 0 0
  • 問答 1. 如何判斷一個元素是否出現(xiàn)在窗口可視范圍(瀏覽器的上邊緣和下邊緣之間,肉眼可視)。寫一個函數(shù) isVis...
    小木子2016閱讀 232評論 0 0
  • 思考 1、如果窗口resize了2、如果節(jié)點加入重復了3、怎樣判斷元素是在視窗范圍內(nèi)* 1、如何判斷一個元素是否出...
    饑人谷_阿靖閱讀 375評論 0 0

友情鏈接更多精彩內(nèi)容