2

したがって、ワイドモニターでは2upのレイアウトになり、メディアクエリを使用して小さいモニターではリストビューになります。ワイドスクリーン設定にjQuery.show（）/。hide（）要素があることを除いて、すべてが本当にうまく機能します。これもうまく機能しますが、ウィンドウのサイズを変更すると、メディアクエリでdisplay：block;を定義しているにもかかわらず、jQueryが現在.hide（）dしているものは表示されません。そのサイズの要素に対して。

問題のサイトはここにあり、ソースはGitHubにあります。

何が間違っているので、どうすれば修正できますか？

4

1 に答える 1

3

まず第一に、jQuery は変更した要素のスタイルを置き換えるため、以前の CSS が何であれ、次のように使用します。

$("#myelement").hide();

CSS 表示プロパティを強制的に変更します。ここには 2 つのオプションがあります。

1) 非表示のクラスを作成します。この方法で、クラスのメディア クエリを作成できます。したがって、ウィンドウが 1000px を超えると、display:none; が表示されます。ただし、1000 < の場合は、display:block; を持つことができます。使用:

$("#myElement").addClass("hidden");

hide() の代わりに。

2) ウィンドウにバインドされた jQuery http://api.jquery.com/resize/の resize() イベントで遊んでください。この方法でこれを行うことができます。

$(window).resize(function(){
    if($(window).width()> 1000){
        //Hide or show, or do some pirate stuff
    }else{
        //More pirate stuff
    }
});

これがあなたが探していたものであることを願っています。

于 2012-10-05T06:47:39.467 に答える