Fadeout elements hide elements which fadein
i have these html code:
<body>
<div id="top">
<div id="panels">
<div id="yes">yes</div>
<div id="no">no</div>
</div>
</div>
</body>
I using jQuery (i`m not a specialist) to fadeout old elements and by ajax adding new (ajax code is not ready now)..so the c开发者_开发百科ode:
$(document).ready(function(){
jQuery('#yes').click(function(){
$('#panels').fadeOut(1000);
var fun = $('<div>ITS OVER</div>');
$(fun).hide().appendTo('#panels').fadeIn(1500);
});
});
but it works like: i click on the button (#yes) it start to fadeout old elements during this process it fadein new, and when fadeout finish both elements is not displaied, what is the problem? P.S. Sorry for my English
You are appending it to a hidden container $('#panels').fadeOut(1000);.
You could just hide the children $('#panels').children().fadeOut(1000) instead of the whole container.
Since your new content would ideally load into the container. I am emptying out panels, and adding the dynamic content.
$('#panels').fadeOut(1000, function(){
$(this)
.html('<div>ITS OVER</div>')
.fadeIn(1500);
})
加载中,请稍侯......
精彩评论