jqueryでスクロールするときにクラスを消す方法

Question

ブラウザでスクロールするときにクラスを消す方法を調べようとしています。私は、このコードを使ってブラウザの特定の高さに達したときにクラスを表示させることができました。

jQuery(".tetapElement").css("opacity", 1); 
 
    
 
jQuery(window).scroll(function() { 
 
\t var windowHeight = jQuery(window).height(); 
 
\t if (windowHeight < 470) { 
 
\t  jQuery(".tetapElement").css("opacity",1); 
 
\t } else if (windowHeight > 1820) { 
 
\t jQuery(".tetapElement").css("opacity",1); 
 
} 
 
else { 
 
    jQuery(".tetapElement").css("opacity",0); 
 
} 
 
});

.tetapElement { 
 
    \t position:fixed; 
 
\t \t top: -30%; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<!--make another checkout button --> 
 
\t \t 
 
\t \t <div class="tetapElement"> 
 
\t \t \t <div class="order_title">Order details:</div> 
 
\t \t \t <div class="order_bar_details"> 
 
\t \t \t \t <div class="pack_name"><?php echo $post->post_title ;?></div> 
 
\t \t \t \t <div class="pack_name_value">Package name:</div> 
 
\t \t \t \t 
 
\t \t \t \t 
 
\t \t \t \t <div class="pack_details"></div> 
 
\t \t \t \t 
 
\t \t \t \t <div class="addon_title">Add-On Menu</div> 
 
\t \t \t \t <div class="addon_details"></div> 
 
\t \t \t </div> 
 
\t \t \t <div class="order_price">Total price (<?php echo $currency; ?>): <span class="total_price">0</span></div> 
 
\t \t \t 
 
\t \t \t <div class="chekout_link"> 
 

 
\t \t \t \t \t <textarea id="order_details" style="display:none;" name="order_details" ></textarea> 
 
\t \t \t \t \t <?php wp_nonce_field('process_checkout_action','process_checkout_field'); ?> 
 
\t \t \t \t \t <input type="submit" class="btn btn-success checkout_btn mk-flat-button shop-black-btn" value="Checkout"> 
 
\t \t \t \t 
 
\t \t \t </div> 
 
\t \t \t 
 
\t \t </div>

あなたがそのリンクをクリックすると、ブラウザの高さを低くする場合、別のクラスがポップアップなるように、あなたはhere.でのアクションでそれを見ることができます。しかし、私はそこに置かれた別のクラスを妨害しないように、ユーザーがスクロールアップしたときに、そのクラスを再び消滅させる方法を見つける必要があります。

本質的に2クラスを付けます。スクロールして別のクラスに置き換えたときにクラスが消えてしまい、ユーザーが元のクラスにスクロールして置き換えたときにもこの別のクラスを消しておきます。任意のアイデアjqueryでそれをどのように？

Answer 1

非常によく似た質問が尋ねられますhere。

var lastScrollTop = 0; 
$(window).scroll(function(event){ 
    var st = $(this).scrollTop(); 
    if (st < lastScrollTop){ 
     // upscroll code 
     $(".tetapElement").removeClass("classToRemove"); 
    } 
    lastScrollTop = st; 
}); 

Answer 2

メディアクエリの最大高さは、あなたがこのクラスには、スクリプトで消えるように悪い考えであることをかなり確信して私の意見