javascript - How to properly hide selected dropdown? -


i'm trying achieve similar bootstrap button drop downs (http://twitter.github.io/bootstrap/components.html#buttondropdowns) need lightweight. basic functionality more or less this:

  • on clicking link, corresponding dropdown div opens (works)
  • on clicking link, previous dropdown closes css class removed (works)
  • on clicking on link of opened dropdown, close dropdown (does not work (closes , reopens))
  • on clicking anywhere in body (so outside link , dropdown), close dropdown (does not work)

what should logic behind this?

demo: http://jsfiddle.net/fu2bz/

does code below make sense?

$(document).click( function(){     $('.dropdownbox').hide(0);     $('.dropdown').removeclass('active'); });  $('.dropdown').click( function(event){             event.stoppropagation();     $('.dropdown').removeclass('active');     $('.dropdownbox').hide();     $(this).addclass('active').find('.dropdownbox').slidetoggle(200); }); 

made changes code, added if else logic, seems work.

fiddle: http://jsfiddle.net/fu2bz/1/

code:

$('.dropdown').click( function(event){         event.stoppropagation();  if ($(this).hasclass("active")) {     $('.dropdown').removeclass('active');     $('.dropdownbox').hide(); } else {     $('.dropdownbox').hide();     $(this).addclass('active').find('.dropdownbox').slidetoggle(200); } }); 

Comments

Popular posts from this blog

linux - Does gcc have any options to add version info in ELF binary file? -

android - send complex objects as post php java -

charts - What graph/dashboard product is facebook using in Dashboard: PUE & WUE -