lazyLoad-Assignment

1034 ワード

に質問
1.ウィンドウの表示範囲(ブラウザの上端と下端の間、肉眼で表示)に要素が表示されているかどうかを判断する方法.関数isVisible実装を書く

function isVisible($node){ 
    $el = $($node),
    elTop = $el.offset().top,
    winHeight = $(window).height(),
    scrollTop  = $(window).scrollTop();

if(scrollTop +windowHeight > elTop){
    return true;
    }else{
    return false;
  }
}

2.ウィンドウがスクロールされると、ウィンドウの表示範囲に要素が表示されているかどうかを判断します.表示されるたびにコンソールにtrueを印刷します.コードで実現
jsbin-2
3.ウィンドウがスクロールされると、1つの要素がウィンドウの表示範囲に表示されるかどうかを判断します.エレメントが最初に表示されるとコンソールにtrueが印刷され、その後は処理されません.コードでjsBin-3を実現
4.画像のリロードの原理は何ですか?
ユーザー体験を最適化するために、ユーザーが必要としない画像をロードせずに非常に小さな画像で占有し、ユーザーが画像の可視範囲に入ってからロードする.
code
1.トップに戻る効果(難易度:***)ページが一定距離までスクロールすると、ウィンドウの右下隅にトップに戻るボタンが表示され、ボタンをクリックするとページがトップにスクロールされます.
goToTop
2.以下の画像のリロード効果を実現する(難易度:***)
lazyLoad1
3.無限スクロール効果(難易度:****)を実現.ページがスクロールされると、無限にデータがロードされてページに表示されます.マウスを置くと変色のヒントが表示されます.下部のロードボタンが表示されるとajax送信要求でデータを取得し、appendをコンテナに送信します.イベントバインドはプロキシ方式を使用します.
lazyLoad2
4.アコーディオンアコーディオンカード

Oracleデータベースのclobフィールドがバックグラウンドからフロントエンドに戻る問題の解決

イベントが存在するかどうかを判断する方法