Javascript: остановить слайд-шоу баннеров при наведении курсора мыши (не работает в Firefox) - PullRequest
Новая
       34

Javascript: остановить слайд-шоу баннеров при наведении курсора мыши (не работает в Firefox)

0 голосов
/ 19 июля 2011

Следующий код может остановить баннер слайд-шоу в IE, но не может сделать паузу в 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>

Ответы [ 3 ]

0 голосов
/ 19 июля 2011 
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, если это соответствующий элемент.Если функция тайм-аута запускается при активном атрибуте «paused», не продвигайте баннер.Вы также можете вернуть значение true / false из changeBanner2, чтобы определить, следует ли продвигать счетчик.Таким образом, вы не пропустите изображения, когда мышь уходит и баннер запускается снова.

0 голосов
/ 17 апреля 2015 
    <!-- 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 голосов
/ 19 июля 2011

Чтобы очистить метод clearTimeout(), вам нужно передать справочную переменную setTimeout(). В вашем случае это будет "PromotionTime".

например. clearTimeout(setTimeout_variable). В вашем случае `clearTimeout (promoTime

)

p.s. Вы можете проверить ссылку w3schools.com на http://www.w3schools.com/js/js_timing.asp

пример кода: 

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