1

スタックオーバーフローさん、こんにちは。

どこから始めればよいかわからないため、これに対応するコードはありません。事前にお詫び申し上げます。

私はインターネットで解決策を探しましたが、これは本当に単純である（そして私は物事を複雑にしすぎている）か、やや専門的である可能性があるように感じます.

現在の状況: 私は選択したスライダーとしてCycle2を使用しています (そして、それを使い続けることを好みます - 別のスライダー TBH を使用するのは難しいでしょう)。各スライドには、特定の「色」クラスと「スライド」クラスがあります

必要なもの<body>:アクティブなクラスの色に基づいてクラスを変更する必要があります。

考え: したがって、色クラスの命名規則はまだありませんが、[名前].col-[name]が黄色、赤などのようなものになる可能性があると考えていました。したがって、スライダーのアクティブなクラスがcol-yellowの場合、このクラスを に追加するため、背景色/画像 (必要な CSS は何でも) を本体に追加できます。<body>

次に、アクティブなスライドが変更され、その body クラスがcol-redのようなものに変更された場合、<body>一致します。

これが理にかなっていて、Stack Overflow の素晴らしい人が私を助けてくれることを願っています。

これを読んでくれてありがとう！

4

1 に答える 1

0

少し前に同様の質問に答えました。

デモ http://jsfiddle.net/kevinPHPkevin/7VzaQ/3/

$('.cycle-slideshow').on('cycle-before', function (event, optionHash, outgoingSlideEl, incomingSlideEl, forwardFlag) {
var bg = $(incomingSlideEl).find('img').css('backgroundColor');
$('body').css('background', bg);
});

お役に立てれば

[編集済み] コードを編集したので、アクティブなスライドに割り当てられている本文に同じクラスが割り当てられるようになりました

デモhttp://jsfiddle.net/kevinPHPkevin/7VzaQ/4/

私が何をしたかを説明するために-上記のコードでわかるように、私はvar呼び出されbgた. これvarは、アクティブなスライドの CSS 背景色です。var次に、それを body タグの背景に割り当てます。あなたが要求したように、スタイルの変更だけでなく、クラスの変更が必要でした。これに照らしてattr class、CSSの背景色ではなくを見つけるようにコードを変更しただけです。

Var スニペットの前:

var bg = $(incomingSlideEl).find('img').css('backgroundColor');
    $('body').css('background', bg);

後の Var スニペット:

var bg = $(incomingSlideEl).find('img').attr('class');
$('body').attr('class', bg);
于 2013-06-01T10:21:22.793 に答える