###やりたいこと
「その1」が画面に表示されているときにだけ、「ボタン」を表示させたいです。
html
1<section id="zero"> 2 <P>その0</p> 3</section> 4<section id="one"> 5 <P>その1</p> 6 <button>ボタン</button> 7</section> 8<section id="two"> 9 <P>その2</p> 10</section>
###やってみたこと
画面の高さを測って「.fadeOutLeft」というクラスを付与しよう。という方法で表示させようとしました。
けれど次のjQeuryが動かず、クラスが付与されません。
どうしたらクラスの付与はちゃんとできますでしょうか?
javascript
1$(function() { 2 var one = $("#one"); 3 var two = $("#two"); 4 5 $(window).scroll(function(){ 6 var onePosition = $(one).offset().top - $(window).height(); 7 var twoPosition = $(two).offset().top - $(window).height(); 8 9 if ($(window).scrollTop() > oneposition) { 10 $("#button").removeClass("fadeOutLeft"); 11 $("#button").addClass("fadeInLeft"); 12 } else if ($(window).scrollTop() > twoPosition) { 13 $("#button").addClass("fadeOutLeft"); 14 $("#button").removeClass("fadeInLeft"); 15 } 16 17 }); 18});
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
退会済みユーザー
2018/05/07 00:35
2018/05/08 04:05