Малък помощ с jQuery

oveRLuckEd

Registered
Здравейте,
искам да направя следното нещо с jQuery, но нещо не ми се получава :D
Когато се цъкне на линк, в div с class="postcontent" да се скрие текста който по принцип си го има, да се покаже картинка, след това да се скрие картинката за 1 секунда и да се покаже отново текста.
Ето до къде стигам аз:
[js]$(document).ready(function() {
$(".postcontent").hide();
$(".postcontent").append('<div align="center" id="loader"><img src="images/loading.gif"><br />Please wait...<br /></div>')
setTimeout(
function(){
$("#loader").hide();
$(".postcontent").show();
},1000);
}); [/js]
Просто като скрия текста и после не знам как да сложа на неговото място зареждащата картинка :(
Не искам да правя аякс функция, просто да сложа малко ефект :)
Благодаря предварително.
 
[js]$(document).ready(function() {
$(".postcontent").empty();
$(".postcontent").append('<div align="center" id="loader"><img src="images/loading.gif"></div>')
setTimeout(
function(){
$("#loader").hide();
$(".postcontent").append(<span id="text">Please wait...</span>);
},1000);
}); [/js]

Пробвай така, не съм сигурен дали съм те разбрал
:lol: .
 
Проблемът ти идва от там че ти с $('.postcontent').hide(); скриваш div-а и след това вътре в този невидим div вкарваш loader-чето. Затова не се вижда.

Номера е да добвиш loader-а не като child на .postcontent, а като sibling. т.е. вместо да става
HTML:
<div class="postcontent">text text text<div id="loader"></div></div>
да стане
HTML:
<div class="postcontent">text text text</div><div id="loader"></div>
Затова ще модифицираш функцията си по следният начин:
[js]$(document).ready(function() {
// Скриваме div-a
$(".postcontent").hide();
// Разделих стринга на няколко реда а прегледност
$('<div align="center" id="loader">'
+'<img src="images/loading.gif">'
+'<br />Please wait...<br />'
+'</div>')
.insertAfter('.postcontent'); // Добавяме #loader като sibling na .postcontent
setTimeout(function(){
$("#loader").hide();
$(".postcontent").show();
},1000);
}); [/js]
 

Back
Горе