Control loss with Javascript code -
i wrote javascript website creating , not sure why code runs automatically, 1 of solutions write function/create timer code runs @ time want to.
here js:
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; commented out 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);
here corresponding html:
<div id="intro"> <div id="imgcol"></div> <div id="captioncol"> <p> hi, i'm <b>jenny spring</b>. <br><br> i'm <span id="emp">spin</span> farmer. </p> </div> <p><a href="#" id="gotopage">go to</a></p> <!-- link changed button later being used temporarily. </div>
is able tell why code performs automatically?
thanks!
setinterval()
not sets interval, calls function after each interval. not use function until ready call it. function, settimeout()
available, executes function once.
for example, can move interval calls function start()
, use href act start button
function start() { var moveint = setinterval("move()", 70); var fadeint = setinterval("fadeout()", 60); } <p><a href="javascript:start();" id="gotopage">go to</a></p>
Comments
Post a Comment