variable inside getelementbyid in javascript not working

Question

I want to reuse an image swap function on multiple divs, but the function is not acknowledging the adbox variable on the var rotator = getelementbyid(adbox).

window.onload = animatez(animate);

the animatez function should pass "animate" which is the div id to getelementbyid inside the function.

function animatez(adbox) {
var adbox;
var rotator = document.getElementById(adbox); 
var images = rotator.getElementsByTagName("img");
var counter = 1;
setInterval(function () {
for (var i = 0; i < images.length; i++) {
images[i].style.display = "none"; }
images[counter].style.display = "block";
counter++;
if (counter == images.length) {
counter = 0;}
            }, 1000);
};
window.onload = animatez(animate);

<style>
#animate { width:200px; height:200px; background-color:transparent;
margin:auto; position:absolute;
} 

img {width:200px; height:200px; display:none;}
</style>
<body>
<div id="animate">
<img src="surveyfunny.png">
<img src="myanswertoasurveyquestion.png">
<img src="funny-wheredoyoulive.png">
<img src="funnysurveyquestion2.png">
<img src="funnysurveyquestion.png">
</div>

Why are you re-declaring adbox even if you are passing it as an argument?? Remove var adbox; and try again. — Manish Jangir
– Manish Jangir, Commented Feb 29, 2016 at 19:48

Suever · Accepted Answer · 2016-02-29 21:08:15Z

1

You need give the function a string parameter. Without quote the animate is undefined, javascript throw the error.

see https://jsfiddle.net/pconline2046/u5cbwpuL/3/#

window.onload = function(){
    animatez('animate');
};

edited Feb 29, 2016 at 21:08

Suever

65.6k14 gold badges91 silver badges104 bronze badges

answered Feb 29, 2016 at 20:11

Pengcheng

3231 silver badge5 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Matt Dyer · Accepted Answer · 2016-02-29 19:52:14Z

1

window.onload needs to be set equal to a function, not the result of calling your animatez function. You could do something like this.

window.onload = function(){
    animatez('animate');
};

Also notice that you need to pass a string to your animatez function so I have quoted animate.

Edit: Like some other answers have stated you also should remove the var adbox; line in your function.

answered Feb 29, 2016 at 19:52

Matt Dyer

1267 bronze badges

3 Comments

Lid Over a year ago

Thanks I fixed the code, still learning javascript, why does the animatez function have to be wrapped inside another function before calling window load?

Matt Dyer Over a year ago

window.onload allows you to specify a function that will be called when the window is finished loading. It needs to be set equal to a function reference. This can be defined inline like in my example or be a named function like window.onload = myFunction without the parentheses that would call the function immediatelly.

Matt Dyer Over a year ago

Also you can't define the arguments that are passed to the onload function. This will always be the event object. Wrapping your animatez function inside another function allows passing the argument that you want.

Collectives™ on Stack Overflow

variable inside getelementbyid in javascript not working

2 Answers 2

Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related