javascript - need help on this toggle for little change -
in code below want when click on content inside panel (content contained in p tags within panel), should not slidup panel, till click on panel or elsewhere used not child elements p inside panels, see html in fiddle , click try should not close panel if click event on other used. script helped me mr praveen earlier.
the code is
$(document).ready(function () { $("#toggle li > .panel").hide(); $('.plusminus').html('+'); $('#toggle li').click(function () { if( !$(this).children('.panel').is(":visible") ) { $("#toggle li > .panel").slideup(); $('.plusminus').html('+'); } = $(this).children(".plusminus"); $(this).children(".panel").slidetoggle('fast', function(){ a.html($(this).is(":visible") ? '--' : '+'); }); }); $("body").click(function(event){ if ($(event.target).closest("ul").attr('id') != "toggle") { $("#toggle li > .panel").slideup(); $('.plusminus').html('+'); } }); });
fiddle play is
remove $("#toggle li > .panel").hide();
on document load
make panels open on load
add $("#toggle li > .panel").click(function(event){ event.stoppropagation(); });
make dropdown not close when click inside panel
Comments
Post a Comment