私の問題を説明してください: JS 特殊効果を作りたいです どのような特殊効果ですか? 背景色は複数の DIV で回転し続けます 例: 灰色の背景、1 つの DIV では灰色で表示されます。2 秒後、次の DIV では灰色で表示されます。 ディスカッションへの返信 (解決策) meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 無題ドキュメント <br> #main div{ width:100px; height:100px; background-color:red; margin:10px;} <br> < ;/スタイル> <br> <ボディ> <br> <div class="div1"> </div> div2"></div> <br> <div class="div3"></div> <br> </div> <br> </body> <br> <script> <br> $(function() { <br> var divs = $("#main div"); <br> var current = 0; <br> setInterval(function(){ <br> $(this).css("background-color") ,"赤") <br> }); <br> $(divs).each(function(e){ <br> if(e==current){ <br> $(divs[e]).css("背景色" ," black"); <br> current++; <br> if(current>=divs.length){current=0;} <br> return false; <br> } <br> }); <br> },2000); <br> }); <br> </script> ; <br /> </html> <br> <br> <br> <div class="code" style="position:relative; padding:0px; margin:0px;"><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class='brush:php;toolbar:false;'>$('div:odd').addClass("class1");$('div:even').addClass("class2");</pre><div class="contentsignin">ログイン後にコピー</div></div><div class="contentsignin">ログイン後にコピー</div></div> <br /> <br /> <br /> <div class="code" style="position:relative; padding:0px; margin:0px;"><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class='brush:php;toolbar:false;'>$('div:odd').addClass("class1");$('div:even').addClass("class2");</pre><div class="contentsignin">ログイン後にコピー</div></div><div class="contentsignin">ログイン後にコピー</div></div> <br /> <br /> 上記を無視して、Interval を設定する必要があります <br /> <div class="code" style="position:relative; padding:0px; margin:0px;"><pre class='brush:php;toolbar:false;'>var idx=0;setInterval(function(){var divs = $('div');divs .removeClass("classShow");$('div:eq('+idx+')').addClass("classShow");idx++;idx=idx%divs.length;},2000);</pre><div class="contentsignin">ログイン後にコピー</div></div> <br /> <br /> <div class="code" style="position:relative; padding:0px; margin:0px;"><pre class='brush:php;toolbar:false;'><!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title></head><body> <style> .normal { width: 100px; height: 100px; border: solid 1px gray; margin: 10px; } .current { background-color: gray; } 1 2 3 4 setInterval( play, 1000 * 2 ); // 获取所有的div play.divs = document.getElementById( "container" ).getElementsByTagName( "div" ); // 计时器 play.count = 0; function play() { var divs = play.divs; for (var i = 0; i < divs.length; i++) { if ( i === play.count % divs.length ) { divs[ i ].className = "normal current"; continue; } divs[ i ].className = "normal"; } play.count++; }
