2011-07-19 62 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

請提供一些細節。 –