CODEWITHSUNDEEP
jqueryjquery-ui
Gixxy22
Gixxy22

Reputation: 507

Show a div after hiding it in jqueryui

I am trying to use jQuery + UI to hide a DIV and then show it again when clicking on a particular element.

$(".leftnav").click(function () {
  $(".rightnav").hide("slide", { direction: "down" }, 1000);
});

I have this so far: http://jsfiddle.net/452Yx/22/

I cant work out how to get the DIV to show again by clicking the same element.

Any ideas?

thanks

Mike

Upvotes: 0

Views: 386

Answers (3)

mynewaccount
mynewaccount

Reputation: 446

"I cant work out how to get the DIV to show again by clicking the same element."

http://api.jquery.com/toggle/

$(document).ready(function(){

    $(".leftnav").toggle(function () {

        $(".rightnav").hide("slide", { direction: "down" }, 1000);

    }, function(){

        $(".rightnav").show();

    });

});

Upvotes: 2

Sidharth Mudgal
Sidharth Mudgal

Reputation: 4264

You can simply do:

$(".leftnav").click(function () {
  $(".rightnav").toggle("slide", { direction: "down" }, 1000);
});

Also note that jquery toggle is not exactly the same as jqueryui toggle.

Upvotes: 1

Luka
Luka

Reputation: 321

You could use toggle. Here is something you can do with your code. You could check if object is visible. If is hide or else show. 

$(".leftnav").click(function () {
    if($(".rightnav").is(":visible"))
      $(".rightnav").hide("slide", { direction: "down" }, 1000);
    else $(".rightnav").show();
});

But toggle is better.

Upvotes: 0

Related Questions