メディアクエリでCSSクラスを無効にする方法はありますか？

Question

私はあなたがクラスに関して何かを見るこの

@media only screen and (max-width: 786px) { 
.fadeout {doesItWork?:noItDoesNotWork!;} 
} 

のような場合は、ビューポートの幅未満786px 何か無効にするCSSクラス「フェードアウト」が「$（ウィンドウ）を.scrollTop（）;」私はここに、モバイルデバイスで適切であろうとは思わないjqueryの中で、私はジャバスクリプト/ jqueryの/プラグインを開いていますが、CSSに唯一のソリューションを好むだろうhttps://tympanus.net/Tutorials/FixedFadeOutMenu/

//fadeout script 
$(function() { 
    $(window).scroll(function(){ 
     var scrollTop = $(window).scrollTop(); 
     if(scrollTop != 0) 
      $('.fadeout').stop().animate({'opacity':'0.2'},400); 
     else  
      $('.fadeout').stop().animate({'opacity':'1'},400); 
    }); 

    $('.fadeout').hover(
     function (e) { 
      var scrollTop = $(window).scrollTop(); 
      if(scrollTop != 0){ 
       $('.fadeout').stop().animate({'opacity':'1'},400); 
      } 
     }, 
     function (e) { 
      var scrollTop = $(window).scrollTop(); 
      if(scrollTop != 0){ 
       $('.fadeout').stop().animate({'opacity':'0.2'},400); 
      } 
     } 
    ); 
}); 

から私が得たコードとそれがある

ご協力いただきありがとうございます。

Answer 1

逆のメディアクエリを使用してクラスのCSSを定義するだけではどうですか。

@media only screen and (min-width: 787px) { 
    .A { 
    // style rules here. 
    } 
} 

Answer 2

@media screen and (min-width: 787px) { 
    .A { 
     display: none !important; /* If you just want it hidden */ 
     pointer-events: none; /* If you don't want the user to be able to click */ 
    } 
} 

Answer 3

使用して、必要なパラメータを無効にしてみてください！重要

すなわち、 グレーター768px

.A { 
    margin: 10px; 
    width: 120px; 
} 

768px

@media only screen and (max-width: 786px) { 
.A { 
margin:0px !important; 
width: 120px !important; 
} 
} 

Answer 4

ないあなたは無効にすることによって何を意味するのか全くわから少ないしていますがdisplay:noneやvisibility:hiddenを使用することができます。 visibility:hiddenでは、要素はまだページ上のスペースを占めていますが、それは表示されません。display:noneは要素をまったく表示しません。