jQuery width toggle moves the div to the left -
i have script http://jsfiddle.net/z8cuz/2/ 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; } }); $('#middle').click(function () { if (widthval == false) { $('#left').hide('fade', 300); $('#right').hide('fade', 300, function () { $('#middle').find('.list').show(); $('#middle').find('.close').show(); $('#middle').animate({ width: "96%", opacity: 1 }, 1000); }); widthval == true; } }); $('#right').click(function () { if (widthval == false) { $('#left').hide('fade', 300); $('#middle').hide('fade', 300, function () { $('#right').find('.list').show(); $('#right').find('.close').show(); $('#right').animate({ width: "96%", opacity: 1 }, 1000); }); widthval == true; } }); $('.close').click(function (e) { e.stoppropagation(); $(this).parent().animate({ width: "30%", opacity: 1 }, 1500, function(){ widthval == false; $('#left').show('fade', 600); $('#middle').show('fade',600); $('#right').show('fade', 600); $('.list').hide(); $('.close').hide(); }); });
when click left box, works ok, when click middle or right one, goes left, changes width. want keep position , change width.
use function n yr problem solved
function sorted(obj){ var clonedobj = obj.clone(); obj.remove(); $('#container').prepend(clonedobj); }
here live example
Comments
Post a Comment