html - JQuery Hide Element not working -
i have <ul>
plenty of <li>
's under it. each of these <li>
's has hidden <div class=dbox">
within. structure/hierarchy <li>
's , content is:
--> li
---->visible content (h3, img, p, etc.)
---->hidden div.dbox
-------> div.photos
-------> div.specs
when clicking <li>
's image (always visible), <div class="dbox">
given display=block. far good. searched web .dbox close whenever clicking outside it. got work:
var mouse_is_inside = false; $('.dbox').hover(function(){ mouse_is_inside=true; }, function(){ mouse_is_inside=false; }); $("body").mouseup(function(){ if(! mouse_is_inside) $('.dbox').hide(); });
clicking outside .dbox makes close. far good. next step add 'close window button less tech-savy users, so, within <div class="specs">
, added 1 last element, <span class="close">
gave jquery code:
$('span.close').click(function() { $(this).parent().parent().hide(); });
which did not work. tested parents('.dbox') , didn't work either. funny enough, when target .dbox hide doesn't work. if like:
$(this).parent().hide();
which close containing div, <div class="specs">
, works , closes <div class="specs">
i thought there sort of conflict 'click outside' code removed , bug remained...which leads me here ask knowledge-able fellows dilemma.
thanks in advance g.campos
i got work: $(this).parents('.dbox').hide(1);
when hide() empty nothing happens. adding 1 or whatever number trick. why can't 0 though?
Comments
Post a Comment