CODEWITHSUNDEEP
jqueryhtml
Dan Worlds
Dan Worlds

Reputation: 35

How to Determine if Div is Toggled Jquery

I'm using the example found here: https://stackoverflow.com/a/18110473/4847069, but I also want to check if a div is toggled or not. I'm not too familiar with Jquery, so I'm having trouble adding an if condition to the example provided. Any help will be greatly appreciated! Thanks!

Upvotes: 0

Views: 2023

Answers (1)

Rick Hitchcock
Rick Hitchcock

Reputation: 35670

Use $(obj).is(':visible') to determine if an object obj has been toggled as "visible."

Using the example in your linked post:

$('.orange').hide();

$('.gray, .orange').on('click', function() {
  $('.gray, .orange').toggle();

  if($('.gray').is(':visible')) {
    $('#output').html('gray');
  }
  else {
    $('#output').html('orange');
  }      
});
.blue{
  height:100px;
  width:250px;
  background:#1ecae3;
  float:left;
}
.gray{
  height:100px;
  width:100px;
  background:#eee;
  float:left;    
}

.orange{
  height:100px;
  width:150px;
  background:#fdcb05;
  float:left;     
}

#output {
  clear: both;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="blue"></div>
<div class="gray">
    <p> Show --> </p>
</div>
<div class="orange" >
    <p> -- Hide </p>
</div>

<div id="output"></div>

Upvotes: 2

Related Questions