CODEWITHSUNDEEP
javascriptjquerytogglejquery-events
A_funs
A_funs

Reputation: 1246

jQuery toggle .click() function

I am unsure if this is a "callback' that I need or not, but basically I am trying to emulate the reversal of the function like on the .hover() effect with the .click() effect. Is this possible. So basically, if the user clicks again on the link, the reverse of what just happened, ie a div closing as opposed to opening, will happen. Is it possible to do this with .click()?

$(document).ready(function(){
    $('.content_accrd').css({"height":"0px"});
$('.paneltop').click( function() {
    $(this).css({"background-position":"0px -21px"})
    .siblings().animate({"height":"100px"}, 200)
}, function() {
$(this).css({"background-position":"0px 0px"})
    .siblings().animate({"height":"0px"}, 200);

})
})

Upvotes: 3

Views: 16124

Answers (3)

njr101
njr101

Reputation: 9629

No, the click action will always do the same thing. If you want it to have alternating effects you will have to check the current state of the element and switch it to the new state accordingly.

This looks something like:

  $('#foo').click(function () {
    if ( $('#foo').is(':visible') ) {
      $('#foo').hide();
    } else {
      $('#foo').show();
    }
  });

Depending on the effect you are trying to achieve this could be any change you want.

Upvotes: 0

genesis
genesis

Reputation: 50974

try toggle

$(".paneltop").toggle(function(){
    //first click happened
},function(){
    //second click happened
});

Upvotes: 2

Matt Ball
Matt Ball

Reputation: 359966

Use .toggle(), not .click().

Description: Bind two or more handlers to the matched elements, to be executed on alternate clicks.

Upvotes: 5

Related Questions