5

jQuery ：nth-​​child（）セレクターを使用して、divの長いリストの4つおきの要素から右マージンを削除することに成功しました。次のようになります。

$(".myDivClass:nth-child(4n+4)").css("margin-right", 0);

ただし、ページは（jQueryを介した）ユーザーインタラクションにも開かれており、ユーザーが実行できることの1つは、要素の非表示/表示です。要素が非表示の場合、そのスタイルは「display：none」に設定されます。要素はフロートしているため、行の中央にある1つの要素を削除すると、下の行の要素が次のようにジャンプします。

要素が削除されたときのマージンの問題

私の最初の考えは、最初にすべての要素にマージンを追加し、次にそれを4つおきの表示要素から削除することによって全体をやり直すことでした。このようなもの：

$(".myDivClass").css("margin-right","20px");
$(".myDivClass:visible:nth-child(4n+4").css("margin-right", 0);

しかし、2行目は何もせず、上記の例のように疑似セレクターをスタックすることはできないと思います（？）

この問題の解決策はありますか？これを行うためのより良い方法はありますか？

前もって感謝します！

/トーマス

4

2 に答える 2

5

これがあなたの質問に対する直接の答えではないことは知っていますが、ブロック要素の束をそれらの間にいくらかの間隔を空けてフローティングすることで同様のことを行うとき、私は通常それらすべてにマージンを保ちますが、それらの親コンテナに（この場合）負のマージン-要素間の間隔に右に等しい。

このように、親はあなたがそれを望む場所にまだフィットしますが、子供たちは彼らが必要とするスペースで彼らがそうするべきであるようにただ浮かぶでしょう。

于 2011-01-24T20:06:31.623 に答える
1

うーん、わかりました、nth-child()セレクターは正常に機能していないようです。隠された要素を無視しているようです。.remove()したがって、または.detach()閉じた要素が必要になる場合があります。これはデモですが、デモの目的で見やすくするために、マージンではなく境界線を変更します。

$('.box:visible:nth-child(5n+5)').addClass('noSide');

$('.close').click(function() {
    // needs to be removed or detached because the nth child
    // appears to ignore hidden elements
    $(this).parent().detach();
    $('.noSide').removeClass('noSide');
    $('.box:visible:nth-child(5n+5)').addClass('noSide');
});
于 2011-01-24T16:15:29.887 に答える