Reputation: 43
I want to make in if...else statement in jQuery but I am not sure how to set it up for what I want.
Here is what I have:
$(document).ready(function(){
$("#quotes").hide();
$("button").click(function(){
if($("#quotes").hide()==true){
$("#summary").hide();
$("#quotes").fadeIn("slow");
} else {
$("#quotes").hide();
$("#summary").fadeIn("slow");
}
});
});
I want it so that if #quotes is hidden, then on button click, hide #summary and fadeIn #quotes. Otherwise, (if #quotes is showing) hide #quotes and fadeIn #summary.
Upvotes: 1
Views: 127
Reputation: 17579
Consider the following code
$("#quotes").hide();
$("button").click(function(){
$("#summary").slideToggle();
$("#quotes").slideToggle();
});
Upvotes: 0
Reputation: 2051
You should change the if checking like this,
if($("#quotes").is(':hidden')==true){
Upvotes: 1
Reputation: 262939
You can pass the :visible selector to the is() method:
$("button").click(function() {
if(!$("#quotes").is(":visible")) {
$("#summary").hide();
$("#quotes").fadeIn("slow");
} else {
$("#quotes").hide();
$("#summary").fadeIn("slow");
}
});
Upvotes: 4