0

チュートリアルを作成していて、ページ上のすべてのdivを、表示したいdiv以外にフェードさせたいと思っています。どうすればfadeToを使用してこれを行うことができますか？

私は現在、全身をフェードさせるように設定しています。div id "step2"とは別に、ボディをフェードさせるように設定するにはどうすればよいですか？

コード：

<script type="text/javascript">
    $("body").fadeTo("slow", 0.5, function() {
      // Animation complete.
    });
</script>
4

5 に答える 5

5

HTMLを見ずに見分けるのは難しいですstep2が、もしあなたの子供<body>ならこれを行うことができます：

試してみてください：http： //jsfiddle.net/SS5Sm/

$("body").children(':not(#step2)').fadeTo("slow", 0.5, function() {
  // Animation complete.
});

また

$("body > :not(#step2)").fadeTo("slow", 0.5, function() {
  // Animation complete.
});

より深くネストされている場合は、これを試すことができます。

$("body > :not(:has(#step2))").fadeTo("slow", 0.5, function() {
  // Animation complete.
});​

それはあなたのHTML構造についていくつかの追加の仮定をしますが。

于 2010-08-13T13:35:29.823 に答える
1

これは非セレクターの仕事のように聞こえます

于 2010-08-13T13:36:56.440 に答える
1

フェードは、jQueryで選択した要素を含むすべての要素を常にフェードします。表示したいdivが体の真下にない限り、これは注意が必要です。希望する効果を得るには、表示したいdivのクローンを作成し、元のdivと絶対に同じ場所に配置する必要があります。つまり、非表示になっているメインコンテンツをコンテナdiv内に配置する必要があるため、ボディをフェードする代わりに、コンテナdivをフェードし、クローンされたdivをボディのすぐ下のトップレベルに配置します。容器。

<body>
    <div id="content-to-fade">
        ...<div id="div-i-want-">...</div>
    </div>
    <div id="copy-of-div-i-want">...</div>
</body>

したがって、この例では、「copy-of-div-i-want」を作成し、本文に追加してから、「content-to-fade」でfadeToを呼び出します。

この手法は、ドラッグアンドドロップを実装する非常に一般的な方法です。これは、コピーを画面の周囲に簡単かつ効率的に配置できるためです。

于 2010-08-13T13:37:32.523 に答える
0

すべての要素がbodyタグ内に含まれている必要があり、opacityプロパティが継承されるため、ページ上のすべてが半分透明になるため、指定したコードで説明したことを実行することは基本的に不可能です。opacityああ、そのシングルのプロパティをオーバーライドすることdivもできません。

代わりに、あなたがする必要があるのは、おそらくすべてを別のものに移動しdiv、代わりにその1つをフェードすることです。セレクターの使用:notも機能する場合がありますが、これは包括的な解決策ではありません。ページ構造に注意してください。

于 2010-08-13T13:43:23.463 に答える
0

JQueryでcss-selectorsを使用できます:)

$("*:not(div#step2)").fadeTo(...)
于 2010-08-13T13:35:58.580 に答える