How to expand the google logo on google's home page?

Question

I just started learning about the DOM and how to manipulate it, and I got this idea that I want to expand the google logo on google's home page every second using setInterval(). I've been trying some stuff out in the chrome JS console but none of them worked, like:

`

function expander(logo) {
    logo.style.width = "100px";
    logo.style.width += "100px";
}
setInterval(expander(document.querySelector("#hplogo")), 1000);

`

Any help would be appreciated, and thanks in advance.

Answer 1

Try this:

val = 1; 
logo = document.querySelector("#hplogo")
setInterval(
    function(){ 
       logo.style.width = (val * 100) + "px"; 
       val = val + 1; 
    },
1000);

As per SteeveDroz's comment:
setInterval wants the name of the function as its first parameter (it is called a callback). You could call setInterval(expander, 1000), but not with parentheses and parameters. You can also wrap that in an anonymous function as this answer does.