どのようにしてロゴをスワイプし、スワイプしてページから外すことができますか？

Question

私はこれをしばらく見てきましたが、私は恐れています。

Thisサイトには、特にフッターで本当にクールなロゴがスワイプしています。

下にスクロールすると、ヘッダーのロゴが上にスワイプし、ページの下端に当たったときにロゴが上にスワイプして入/切れます。

私は要素を検査し、これだけに関連するCSSを見つけた

：

#wrap .logo-alt { 
    position:absolute; 
    margin-top:0; 
    -webkit-transition:all 0.3s ease-in-out; 
    -moz-transition:all 0.3s ease-in-out; 
    transition:all 0.3s ease-in-out; 
} 
#wrap .logo-alt.gone { 
    position:absolute; 
    margin-top:200px; 
    pointer-events:none; 
} 

それはまた持っている：

data-scrollspeed="600" and a data-scrollpos="0" 

jQueryのは、私が想像してもそこにありますが、どのように正確に効果の作業を行います？上記のタグは何について言及していますか？私はこれを前にして来なかった。 jQueryのコードで

Answer 1

このクールなアニメーションのお得な情報：

$(function(){ 
    $(window).scroll(function(){ 
     if($(window).scrollTop() <= ###){ 
     } else { 
     } 
    }); 
}); 

私はあなたのために、この機能を発揮するために、このcodepenを作成しました。

基本的にブラウザの位置によってアニメーションがトリガーされます（この場合、オブジェクトにクラスを追加したり削除したりしています）。