【问题标题】:Featured Content Slider - Change on hover - slides flickering特色内容滑块 - 悬停时更改 - 幻灯片闪烁
【发布时间】:2012-05-11 13:19:03
【问题描述】:

谁能帮忙?

我在为客户开发的网站中添加了featured content slider,他们询问的其中一个问题是是否可以在悬停时发生幻灯片转换,然后单击幻灯片时 (或者确实是 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);  
}  
); 

有什么想法吗?

【问题讨论】:

    标签: jquery


    【解决方案1】:

    是的,我在加载时也以闪烁结束。

    但我现在找到了解决方案。只需从函数中删除代码'fx:{opacity: "toggle"}',它就可以正常工作了。

    我认为切换和鼠标悬停都不需要。

    【讨论】:

      猜你喜欢
      • 2013-10-21
      • 2022-08-19
      • 2011-03-22
      • 2021-02-08
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2019-01-01
      • 2011-12-06
      相关资源
      最近更新 更多