JavaScript Mouse Over Pause

Я действительно расстраиваюсь своим слайд-шоу JS, я пытаюсь реализовать функцию паузы при переходе в слайд-шоу. Все, что мне нужно, чтобы сделать слайд-шоу, - пауза, когда пользователь нависает над слайдом. Кажется, легко ?! Нет, я попытался включить разные функции, но ничего не похоже на код.JavaScript Mouse Over Pause

<script type="text/javascript">// <![CDATA[ 
var imgs1 = new Array("http://www.cmsplc.com/media/wysiwyg/CMS_XMAS_BANNER_2.jpg","http://www.cmsplc.com/media/wysiwyg/Dymo_XTL_Range.jpg","http://www.cmsplc.com/media/wysiwyg/Banners/Homepage_Banners/Promotional_Banners/Fluke_Cashback_Upgrade_1.jpg","http://www.cmsplc.com/media/wysiwyg/Fluke_DTX_Buy_Back_2015.jpg"); 
var lnks1 = new Array("http://www.cmsplc.com/christmas-opening-times","http://www.cmsplc.com/dymo-xtl","http://www.cmsplc.com/fluke-dsx-upgrade-sept-2015/","http://www.cmsplc.com/fluke-networks-dtx-upgrade-offer/"); 
var alt1 = new Array(); 
var currentAd1 = 0; 
var imgCt1 = 4; 
function cycle1() { 
if (currentAd1 == imgCt1) { 
currentAd1 = 0; 
} 
var banner1 = document.getElementById('adBanner1'); 
var link1 = document.getElementById('adLink1'); 
banner1.src=imgs1[currentAd1] 
banner1.alt=alt1[currentAd1] 
document.getElementById('adLink1').href=lnks1[currentAd1] 
currentAd1++; 
} 
window.setInterval("cycle1()",4000); 
// ]]></script> 
<p><a id="adLink1" target="_top"><img id="adBanner1" src="http://www.cmsplc.com/media/wysiwyg/CMS_XMAS_BANNER_2.jpg" border="0" alt="" width="804" height="300" /></a></p>

В каких случаях в приведенном выше случае мне нужно включить функции паузы?!

источник

2015-12-02 WebLad

Вы видели мой ответ? Вы можете ответить на комментарии ... –

Несколько изменений. Дайте ему так:

// Put this on top. 
var intvl = 0; 

// Replace the setInterval line. 
intvl = window.setInterval("cycle1()",4000);

И добавить этот обработчик событий:

// Add this at the end, may be before `<body />` inside a `<script>` tag. 
adBanner1.onmouseover = function() { 
    clearInterval(intvl); 
} 
adBanner1.onmouseout = function() { 
    intvl = window.setInterval("cycle1()",4000); 
}

Полный код

<p><a id="adLink1" target="_top"><img id="adBanner1" src="http://www.cmsplc.com/media/wysiwyg/CMS_XMAS_BANNER_2.jpg" border="0" alt="" width="804" height="300" /></a></p> 
<script type="text/javascript">// <![CDATA[ 
    var imgs1 = new Array("http://www.cmsplc.com/media/wysiwyg/CMS_XMAS_BANNER_2.jpg","http://www.cmsplc.com/media/wysiwyg/Dymo_XTL_Range.jpg","http://www.cmsplc.com/media/wysiwyg/Banners/Homepage_Banners/Promotional_Banners/Fluke_Cashback_Upgrade_1.jpg","http://www.cmsplc.com/media/wysiwyg/Fluke_DTX_Buy_Back_2015.jpg"); 
    var lnks1 = new Array("http://www.cmsplc.com/christmas-opening-times","http://www.cmsplc.com/dymo-xtl","http://www.cmsplc.com/fluke-dsx-upgrade-sept-2015/","http://www.cmsplc.com/fluke-networks-dtx-upgrade-offer/"); 
    var alt1 = new Array(); 
    var currentAd1 = 0; 
    var imgCt1 = 4; 
    var intvl = 0; 

    function cycle1() { 
    if (currentAd1 == imgCt1) { 
     currentAd1 = 0; 
    } 
    var banner1 = document.getElementById('adBanner1'); 
    var link1 = document.getElementById('adLink1'); 
    banner1.src=imgs1[currentAd1] 
    banner1.alt=alt1[currentAd1] 
    document.getElementById('adLink1').href=lnks1[currentAd1] 
    currentAd1++; 
    } 

    intvl = window.setInterval("cycle1()",4000); 

    adBanner1.onmouseover = function() { 
    clearInterval(intvl); 
    } 
    adBanner1.onmouseout = function() { 
    intvl = window.setInterval("cycle1()",4000); 
    } 
    // ]]> 
</script>

источник

2015-12-02 13:17:47

Спасибо, Правеен, можете ли вы включить изменения в код, который я разместил? Мне сложно определить, куда ваши рекомендации должны идти ... – WebLad

@WebLad Посмотрите на ответ об обновлении. –

Вы - жизнь безопаснее Праве, спасибо вам большое! Я обязательно буду распространять свое имя в сообществе для получения качественных консультаций и помощи. Еще раз спасибо! – WebLad

JavaScript Mouse Over Pause

ответ

Смежные вопросы