Pozdrav, pratim tutorijal iz knjige, uradio sam skoro sve ali ne mogu rijesit sljedeci problem...
Zadatak je bio "animirati" tekst i da se na klik misa zaustavi, uspio sam text "animirati" ali kad kliknem izbaci mi "intervalB is not defined"...
Znam da je problem oko "scopa"... Ali ne znam tocno sta treba uradit...
Ne znam zasto nemam pristup funkciji u kome je intervalB definiran, jer nije lokalni nego globalni scope, da stoji "var intervalB = setInterval(moveHeadingDown, 30);" onda bi bio lokalni, da li sam u pravu?
Ako je netko voljan pomoci bio bi mu zahvalan...
<!DOCTYPE html>
<html>
<head>
<title>Interactive programming</title>
</head>
<body>
<h1 id="heading">Hello world!</h1>
<script src="https://code.jquery.com/jquery-2.1.0.js"></script>
<script>
// We'll fill this in next
var leftOffset = 0;
var topOffset = 0;
var moveHeading = function () {
$("#heading").offset({ left: leftOffset });
leftOffset++;
if (leftOffset > 200) {
leftOffset = 200;
intervalB = setInterval(moveHeadingDown, 30);
}
};
intervalA = setInterval(moveHeading, 30);
var moveHeadingDown = function () {
$("#heading").offset({ top: topOffset });
topOffset++;
if (topOffset > 200) {
topOffset = 200;
intervalC = setInterval(moveHeadingRight, 30);
}
};
var moveHeadingRight = function () {
$("#heading").offset({ left: leftOffset });
leftOffset--;
if (leftOffset < 0) {
intervalD = setInterval(moveHeadingUp, 30);
leftOffset = 0;
}
};
var moveHeadingUp = function () {
$("#heading").offset({ top: topOffset });
topOffset--;
if (topOffset < 0) {
topOffset = 0;
}
};
var clickHandler = function (event) {
clearInterval(intervalA);
clearInterval(intervalB);
console.log("Click!");
};
$("html").click(clickHandler);
</script>
</body>
</html>