js cssが機能しないaltoughtブレークポイントが設定されている

ブレークポイントが1000pxであり、クラスが<header>であるが、私の文書が条件のいずれにも該当していない。ここではCSSでprblemです：js cssが機能しないaltoughtブレークポイントが設定されている

body:not(.logged-in) .header-xs { 
    top: 0; 
    padding-top: 11vh; 
}

とJSの問題です：人は、その後logged-inクラスは<body>に追加されたログインしているとき、私はwordpress.Hereに取り組んでいます

jQuery(window).on('load resize', function(){ 
    if(jQuery(window).width() > 1000 && !jQuery('header').hasClass('header-xs')){ 
     jQuery('body').css('margin-top', '0'); 
     jQuery('header').css({'margin-top': 'inherit', 'padding-top' : 'inherit'}); 
    } 
})

しかし、私はログインしていない状態で働いています。

そして、jsが'margin-top': 'inherit'; 'padding-top' : 'inherit'を追加すると、モバイルの幅のサイズにリサイズさえしても維持されます。

出典

2017-05-10 muhaimin

幅が1000以上である場合にのみ、これらのCSSプロパティを変更示し、それはそれらを削除することはありません。サイズを1000以下に設定/削除するには、「else」ケースが必要です。 – nnnnnn

ヘッダと本文はありますか？あなたのCSSはヘッダーをターゲットできません。それは兄弟や子供だけ行くことができます –

私はあなたの問題を理解するために最善を尽くしているので、これを試して、あなたがやろうとしていることに近い場合は私に教えてください。

また、クラスを使用して本文の上にあるヘッダーをターゲティングしようとすると、実際にはうまくいかないでしょう。 jsを使う必要があるかもしれません。あなたの最後の文、JSについて

jQuery(window).on('load resize', function() { 
 
\t console.log('resize - '+jQuery(window).width()); 
 
    if (jQuery(window).width() > 1000) { 
 
\t \t jQuery('header').removeClass('header-xs'); 
 
    jQuery('body').css('margin-top', '0'); 
 
    jQuery('header').css({ 
 
     'margin-top': 'inherit', 
 
     'padding-top': 'inherit' 
 
    }); 
 
    } else { 
 
\t \t jQuery('header').addClass('header-xs'); 
 
\t } 
 
})

body:not(.logged-in) .header-xs { 
 
    top: 0; 
 
    padding-top: 11vh; 
 
\t background: red; 
 
} 
 

 
body { 
 
\t background: green; 
 
} 
 

 

 
.header-xs { 
 
\t boder: 15px solid blue; 
 
\t height: 250px; 
 
\t width: 100px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<header class="header-xs"> 
 
</header> 
 
<body> 
 
</body>

出典

2017-05-10 02:57:55

のCSSについて：そのような： '

' – muhaimin

@muhaimin ok、あなたは削除したい場合'header-xs'とこのクラスをどのように追加する必要がありますか？ –

js cssが機能しないaltoughtブレークポイントが設定されている

答えて

関連する問題