Jquery.slidetoggle () and .toggle () together, the first click doesn’t work, then

Question

I'm trying to create a harmonic interface, but you can open several sections at once. In addition, in addition to expanding the content section for viewing, I exchange the image for the “title” that was clicked. Everything works, but the first click on each "header" does nothing. Each subsequent click works as expected.

Here's a link to the fiddle I created: http://jsfiddle.net/kJ8t6/5/

Any help would be greatly appreciated. I tried to understand this from yesterday and must move on to other things.

Thanks in advance.

Answer 1

You do not need to bind an additional click event, since toggle already a mouse event. However, you should consider that the toggle event is currently out of date, so try to use it with caution.

 $("#imgDeliver").toggle(function() { $(this).attr("src", "..."); $('#conDeliver').slideToggle(); }, function() { $(this).attr("src", "..."); $('#conDeliver').slideToggle(); }); 

DEMO: http://jsfiddle.net/kJ8t6/6/