Эфект на клик jquery

188

14 апреля 2017, 20:02

Ума не приложу как сделать банальную вещь. Есть список. При клике на иконку, добавляется класс active и список раскрывается, при еще одном клике, сворачивается. Нужно сделать так что бы при клике на все остальное кроме этого же списка, список сворачивался.

Answer 1

$(document).click(function(e) {
  if ($(e.target).closest(".active").length == 0) {
    $(".active").сворачивается();
  }
});

Answer 2

Как-то так можно

jQuery('.list span').click(function(){ 
  if(!jQuery(this).hasClass('is-active')) { 
    jQuery('.list span').removeClass('is-active').siblings('ul').slideUp(200); 
    jQuery(this).addClass('is-active').siblings('ul').slideDown(200); 
  } else if(jQuery(this).hasClass('is-active')){ 
    jQuery(this).removeClass('is-active').siblings('ul').slideUp(200); 
  } 
})

.list ul{ 
   display:none; 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<div class="list"> 
<span>LOL</span> 
<ul> 
<li>SomeString</li> 
<li>SomeString</li> 
<li>SomeString</li> 
</ul> 
</div> 
<div class="list"> 
<span>LOL</span> 
<ul> 
<li>SomeString</li> 
<li>SomeString</li> 
<li>SomeString</li> 
</ul> 
</div> 
<div class="list"> 
<span>LOL</span> 
<ul> 
<li>SomeString</li> 
<li>SomeString</li> 
<li>SomeString</li> 
</ul> 
</div>