2011-07-19 38 views
0

以下代码可以停止在IE中的幻灯片横幅,但不能在Firefox中暂停? 请帮忙。Javascript:停止横幅幻灯片时mouseover(不在Firefox中工作)

谢谢。

以下是我的JavaScript代码来显示横幅:

var promotionTime; 
var p=0; 
var zone=0; 

function changeBanner2(imgFile,imglink,altText){ 
//pause banner when mouseover 
if((document.getElementById("promotionBanner").getAttribute("paused"))!=true)  {  
document.getElementById("promotionBanner").src=imgFile; 
document.getElementById("promotionBanner").title=altText; 
document.getElementById("bannerLink").href=imglink; 
} } 

function promotionBannerChanger(promotionImg,promotionLink,promotionAlt,num){ 
if(zone!=num){ 
    p=0; 
    zone=num; 
} 

//set attribute to pause banner when mouseover 
document.getElementById("promotionBanner").onmouseover = 
        function() { this.setAttribute("paused", true);} 
document.getElementById("promotionBanner").onmouseout = 
        function() { this.removeAttribute("paused");} 

changeBanner2(promotionImg[p],promotionLink[p],promotionAlt[p]); 
p++; 
if(p>=promotionImg.length){ 
    p=0; 
} 
clearTimeout(promotionTime); 
if(num==1) 
    promotionTime=setTimeout("promotionBannerChanger(promotionImage1,promotionLink1,promotionAlt1,'1')",2000); 
else if(num==2) 
    promotionTime=setTimeout("promotionBannerChanger(promotionImage2,promotionLink2,promotionAlt2,'2')",2000); 
else if(num==3) 
    promotionTime=setTimeout("promotionBannerChanger(promotionImage3,promotionLink3,promotionAlt3,'3')",2000); } 

ASP代码:

  <td width="480" > 
      <div id="banner" oonmouseover="paused=true;" onmouseout="paused=false;"> 
        <a id="bannerLink" href="archive.htm"><img title="Hot Topic" src=./promotion/1/en/c1Lagge.GIF id="promotionBanner" width="480" height="252" border="0"></a> 
      </div> 
       </td> 
      </table> 

回答

0
document.getElementById("promotionBanner").onmouseover = 
         function() { this.setAttribute("paused", true); }; 
document.getElementById("promotionBanner").onmouseout = 
         function() { this.removeAttribute("paused"); }; 


function changeBanner2(imgFile,imglink,altText){ 
    if(document.getElementById("promotionBanner").getAttribute("paused")) { 
     document.getElementById("promotionBanner").src=imgFile; 
     document.getElementById("promotionBanner").title=altText; 
     document.getElementById("bannerLink").href=imglink; 
    } 
} 

基本上,悬停,您添加“顿了顿“属性为promotionBanner,如果这是相关元素,如果在”paused“属性处于活动状态时运行超时函数,请不要超前横幅,也可以按顺序从changeBanner2中返回true/false值以确定你是否一个dvance柜台。这样,当鼠标离开并且横幅再次启动时,您将不会跳过图像。

+0

非常感谢。代码完美工作。 –

+0

我发现它适用于IE。但不适用于Firefox。请帮忙。谢谢。 –

+0

糟糕。我忘了关闭悬停的匿名函数。两者都应该有一个“};”在他们的行结束。 – Dennis

0

要清除clearTimeout()方法,你需要通过setTimeout()参考变量。在你的情况下,这将是“promotionTime”。

例如clearTimeout(setTimeout_variable)。在你的情况,`clearTimeout(promotionTime

PS你可以检查在http://www.w3schools.com/js/js_timing.asp

代码示例w3schools.com链接:

elements = document.getElementById('promotionBanner'); 
elements.onmouseover = function (promotionTime) { 
    clearTimeout(promotionTime); 
} 
0
<!-- Start WOWSlider.com BODY section --> <!-- add to the <body> of your page --> 
<div id="wowslider-container_fairy_tale"> 
<div class="ws_images_fairy_tale"><ul> 
    <li><img src="images/fairy%20tale/1.jpg" id="Img1"/></li> 
    <li><img src="images/fairy%20tale/2.jpg" id="Img2"/></li> 
    <li><img src="images/fairy%20tale/3.jpg" alt="3" title="3" id="Img2"/></li> 
    <li><img src="images/fairy%20tale/4.jpg" alt="4" title="4" id="Img3"/></li> 

</ul></div> 

<div class="ws_shadow"></div> 
</div> 
<script type="text/javascript" src="fairy_tale/js/wowslider.js"></script> 
<script type="text/javascript" src="fairy_tale/js/script.js"></script> 
<!-- End WOWSlider.com BODY section -->[enter link description here][1] 
+0

请提供一些细节。 –