CODEWITHSUNDEEP
javascriptjqueryhtmlcss
Sam Mcleod
Sam Mcleod

Reputation: 425

Unresponsive buttons

For some reason I have a bug in my code, which is causing some buttons to be unresponsive.

Can any body see any errors in my code?

$('#arrowbutton').click(function(){
    console.log('arrowbutton clicked');  
    $('#code2').animate({'opacity': '1'}, 350)
})
#arrow{
    margin-left:384px;
    z-index:15;
    margin-top:50px;
    width:25px;
    z-index:20;
    position:fixed;
}
<a id="arrowbutton"> <img src="images/step-22.png" id="arrow"> </a>

I am not getting any errors and I am not getting the console.log() message either.

Any reasons why this wouldn't be working?

Upvotes: 0

Views: 329

Answers (1)

Taryn East
Taryn East

Reputation: 27747

If you have more than one button with the id #arrowbutton it can get confused - or only put the event on one or just break (depending on which browser you use)

ids need to be unique to an html page So if you want more than one link to have this behaviour, then you should change it to a class instead.

eg

<a class="arrowbutton"> <img src="images/step-22.png" id="arrow"> </a> 

$('.arrowbutton').click(function(){
    console.log('arrowbutton clicked');  
    $('#code2').animate({'opacity': '1'}, 350);
});

(Note: not actually tested, could be buggy)

Upvotes: 1

Related Questions