1

1つを表示し、もう1つを継続的に非表示にする2つのdivがあります。私が持っているコードは最初のものだけを示していますMass_alert。両方のdivを順番に表示および非表示にするには、何を修正する必要がありますか。

これがHTMLです。

  <div style="position: relative; top: 50px; width: 778px; margin: 0 auto;">
    <div id="alerts" style="float: right; width:200px; height: 25px; background: goldenrod; border-radius: 3px 3px 3px 3px; font: 11px Arial; color: #404040; overflow: hidden;"> 
      <div id="Mass_alert" class="alert" style="position: relative; top: 5px; margin: 0 auto; text-align: center; width:100%; height: 20px;"></div>
      <div id="Devotion_alert" class="alert" style="position: relative; top: 5px; margin: 0 auto; text-align: center; width:100%; height: 20px; visibility: hidden;"></div>
    </div>
  </div>

フェードトグルを行うためのコードはこれです。

$(document).ready(function() {  
    show_next_Mass(channel_array_sort);
    show_next_devotion();
    setInterval("show_alerts()",10000);

    var continuous = function () {
        $("#Mass_alert").fadeToggle(600);
        $("#Devotion_alert").fadeToggle(600);   
    };

    setInterval(continuous,600);
});
4

2 に答える 2

1

このAPIドキュメントから判断すると、非表示の要素のdisplay: none;代わりにを使用する必要があります。visibility: hidden;

于 2012-04-21T15:42:20.830 に答える
0

.fadeToggle()次の属性の変化を見ると、何がわかりますか

opacity: 0;
display: none;

（アレクサンダーも彼の答えで指摘したように。）

したがって、これを2番目のdivのstyle属性にコピーしました。しかし、それはうまくいきませんでした。私の仮定では、jQueryは要素に対して何をしたかを何らかの方法で追跡しますが、最初のCSSを実際には認識しません。

私の考えでは、jQueryは要素に対して何をしたかをある程度追跡しますが、HTMLにすでに付属しているスタイルを実際には認識していません。そこで、2番目のdivのCSSを非表示の関連属性から削除.hide()し、「初期化関数」に入れました。

動作しているようです（@jsFiddle）

于 2012-04-21T16:28:51.060 に答える