0

誰か助けてもらえますか?

クライアント向けに開発しているWebサイトに注目のコンテンツスライダーを追加しました。彼らからのコメントの1つは、ホバー時にスライドトランジションが発生するかどうか、そしてスライドをクリックしたとき(または実際にはui-tabs)宛先URLに移動します。

私が持っているjQueryは、デモに付属している標準です(私はまだあなたが見ることを学んでいます)

    $(document).ready(function(){  
    $("#featured").tabs({fx:{opacity: "toggle"}}).tabs("rotate", 5000, true);  
    $("#featured").hover(  
    function() {  
        $("#featured").tabs("rotate",0,true);  
    },  
    function() {  
    $("#featured").tabs("rotate",5000,true);  
    }  
    );
    });

「ホバーで一時停止」機能が追加されています。

とにかく、タブのHTMLは次のとおりです。

  <ul class="ui-tabs-nav">
    <li class="ui-tabs-nav-item ui-tabs-selected" id="nav-fragment-1"><a href="#fragment-1"><span class="panelTitle">Find a<br />
      <span class="panelTitleMain">Boat</span></span> <span class="panelCopy">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</span></a></li>
    <li class="ui-tabs-nav-item" id="nav-fragment-2"><a href="#fragment-2"><span class="panelTitle">Find an ABYA<br />
      <span class="panelTitleMain">Broker</span></span> <span class="panelCopy">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</span></a></li>
    <li class="ui-tabs-nav-item" id="nav-fragment-3"><a href="#fragment-3"><span class="panelTitle">TBC<br />
      <span class="panelTitleMain">TBC</span></span> <span class="panelCopy">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</span></a>&lt;</li>
  </ul>

次のようにマウスオーバーでスライダーを変更することができましたが、ロード時に画像がちらつきます。

$("#featured").tabs({event: 'mouseover', fx:{opacity: "toggle"}}).tabs("rotate", 5000, true);  
$("#featured").hover(  
function() {  
    $("#featured").tabs("rotate",0,true);  
},  
function() {  
$("#featured").tabs("rotate",5000,true);  
}  
); 

何か案は?

4

1 に答える 1

2

はい、私もロード時にちらつきで終わりました。

しかし、私は今それに対する解決策を見つけました'fx:{opacity: "toggle"}'.関数からコードを削除するだけで、うまくいきます.

トグルとマウスオーバーの両方は必要ないと思います。

于 2012-11-18T07:04:55.343 に答える