jQuery starts another function and I don't want it -
i have script: http://jsfiddle.net/z8cuz/
jquery code:
$('.list').hide(); $('.close').hide(); var widthval = false; $('#left').click(function(){ if(widthval == false){ $('#middle').hide('fade', 300); $('#right').hide('fade', 300, function(){ $('#left').find('.list').show(); $('#left').find('.close').show(); $('#left').animate({ width: "96%", opacity: 1 }, 1000 ); }); widthval == true; } }); $('.close').click(function(){ $(this).parent().animate({ width: "30%", opacity: 1 }, 1500 ); widthval == false; $('#middle').show(); $('#right').show(); $('.list').hide(); $('.close').hide(); });
when click #left
div, works ok, when click x
, should hide details, hide x
, show #middle
, #right
tags , set width 30%. this, comes 96% width. don't know why...
that's because click event propagating dom , triggering click event on left div again. use e.stoppropagation();
prevent this. change close code to:
$('.close').click(function (e) { e.stoppropagation(); $(this).parent().animate({ width: "30%", opacity: 1 }, 1500); widthval == false; $('#middle').show(); $('#right').show(); $('.list').hide(); $('.close').hide(); });
Comments
Post a Comment