Потеря контроля с Javascript кодом

Question

Я написал этот Javascript для создаваемого веб-сайта, и я не уверен, почему код запускается автоматически, одним из моих решений является написать функцию/создать таймер, чтобы код работал в то время Я хочу этого.

здесь является ЯШ:

var introCap = document.getElementById("captionCol"); 
var imgDiv = document.getElementById("imgCol"); 
var introDiv = document.getElementById("intro"); 
var expose = document.getElementById("gotoPage"); 
var fade = 1; 
var l = 15; 
var r = 45; 

//expose.onclick = move; this is commented out for the time being. 

function stop() { 
    clearInterval(moveInt); 
    clearInterval(fadeInt); 
    } 

function fadeOut() { 
    fade -= 0.07; 

    introDiv.style.opacity = fade; 
    introDiv.style.filter = "alpha('"+fade+"')"; 
    if(introDiv.style.opacity<0) { 
     stop(); 
     } 
    } 
    var fadeInt = setInterval("fadeOut()", 60); 

function move() { 
    l -= 0.1; 
    r += 0.1; 

    introCap.style.left = r+"%"; 
    imgDiv.style.left = l+"%"; 

    if (imgDiv.style.left<10) { 
    fadeOut(); 
    } 
    } 
    var moveInt = setInterval("move()", 70); 

здесь соответствующий HTML:

<div id="intro"> 

     <div id="imgCol"></div> 

     <div id="captionCol"> 
      <p> Hi, I'm <b>Jenny Spring</b>. <br><br> 
      I'm a <span id="emp">SPIN</span> farmer. </p> 
    </div> 

    <p><a href="#" id="gotoPage">Go To</a></p> <!-- this link will be changed to a button later but is being used as is temporarily. 

</div> 

ли кто-нибудь может сказать, почему этот код выполняет автоматически?

Спасибо!

Answer 1

setInterval() не только устанавливает интервал, но также вызывает функцию после каждого интервала. Поэтому не используйте эту функцию, пока вы не сможете ее вызвать. Доступна другая функция: setTimeout(), которая выполняет эту функцию только один раз.

Например, вы можете перемещать интервал вызовов функции start() и использовать HREF действовать как кнопка запуска

function start() { 
    var moveInt = setInterval("move()", 70); 
    var fadeInt = setInterval("fadeOut()", 60); 
} 

<p><a href="javascript:start();" id="gotoPage">Go To</a></p> 

Источник: http://www.w3schools.com/js/js_timing.asp