Javascript：鼠标悬停时停止横幅幻灯片（在 Firefox 中不起作用）

发布于 2024-11-25 02:37:00 字数 1897 浏览 7 评论 0原文

下面的代码可以在 IE 中停止幻灯片横幅，但在 Firefox 中无法暂停？请帮忙。

谢谢。

Joe

以下是我显示横幅的 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>

原文

The following code can stop the slideshow banner in IE, but cannot pause in Firefox ?
Please help.

Thanks.

Joe

The following is my javascript code to display banner:

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 code:

            <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>

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

一身仙ぐ女味 2024-12-02 02:37:00

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;
    }
}

基本上，在悬停时，您可以将“paused”属性添加到 PromotionBanner（如果这是相关元素）。如果超时函数在“暂停”属性处于活动状态时运行，则不要推进横幅。您可能还想从changeBanner2 返回真/假值，以确定是否推进计数器。这样，当鼠标离开且横幅再次启动时，您将不会跳过图像。

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;
    }
}

Basically, on hover, you add the "paused" attribute to the promotionBanner, if that is the relevant element. If the timeout function gets run while the "paused" attribute is active, don't advance the banner. You may also want to return a true/false value from changeBanner2 in order to determine whether or not you advance the counter. This way, you won't skip images when the mouse leaves and the banner starts up again.

回复收藏 0 原文

硪扪都還晓 2024-12-02 02:37:00

要清除 clearTimeout() 方法，您需要传递 setTimeout() 引用变量。在你的情况下，它将是“promotionTime”。

例如clearTimeout(setTimeout_variable)。在您的情况下，`clearTimeout(promotionTime

p.s.您可以检查 w3schools.com 链接 http://www .w3schools.com/js/js_timing.asp

代码示例：

elements = document.getElementById('promotionBanner');
elements.onmouseover = function (promotionTime) {
    clearTimeout(promotionTime);
}

To clear a clearTimeout() method, you need to pass the setTimeout() reference variable. In your case, it would be "promotionTime".

e.g. clearTimeout(setTimeout_variable). In your case, `clearTimeout(promotionTime

p.s. you can check the w3schools.com link at http://www.w3schools.com/js/js_timing.asp

code example:

elements = document.getElementById('promotionBanner');
elements.onmouseover = function (promotionTime) {
    clearTimeout(promotionTime);
}

回复收藏 0 原文

乖乖哒 2024-12-02 02:37:00

    <!-- 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]

    <!-- 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 原文

~没有更多了~