Подгрузка меню как в facebook
Собственно кто знает как реализовать подгрузку контента...
к примеру в соц. сети facebook в шапки сайта есть меню, при клике на иконку открывается блок с индикатором загрузки, как контент под грузился индикатор исчезает оставляя меню (сообщения, оповещение, настройки и т.д) кто зарегестрирован в facebook знает о чем я). смотрел код не смог разобраться как это все реализовано. я только стал изучать ajax и попытался написать код:
в HEAD
<script type="text/javascript">
function showElement(layer){
var myLayer = document.getElementById(layer);
if(myLayer.style.display=="none"){
myLayer.style.display="block";
myLayer.backgroundPosition="top";
} else {
myLayer.style.display="none";
}
}
</script>
<script type="application/javascript" src="<?php print($host)?>/js/jquery-1.5.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#fbRequestsList_loading_indicator").hide(); //Скрываем прелоадер
});
$(function(){
$("#requestsCountWrapper").click(function()
$("fbRequestsList_loading_indicator").show();
$ajax ({
url: "http://bloger.com/user/Head_Menu.php",
type: "GET",
data: {"num": num},
cache: false,
success: function(response){
if(response == 0){ // смотрим ответ от сервера и выполняем соответствующее действие
alert("Больше нет записей");
$("#fbRequestsList_loading_indicator").hide();
}else{
$("#content").append(response);
num = num + 5;
$("#fbRequestsList_loading_indicator").hide();
}
}
});
});
});
</script>
в теле документа:
<a href="#" class="button_klik fl_l" onclick="javascript:showElement('v-menu')" id="requestsCountWrapper">
<div class="fl_l" id="ic_men"></div>
</a>
<ul id="v-menu" class="v-menu" style="display:none;">
<a href="#" class="button_klik fl_l" onclick="javascript:showElement('v-menu')">
<div class="fl_l" id="ic_mene"></div>
</a></li>
<div class="fl_l" id="bidkow">
<li class="fl_l" style="width:188px"><div class="fl_l ukazatel-v"></div></li>
<li id="divContent"></li>
<li id="fbRequestsList_loading_indicator"><img src="../img/img_sistem/ajax-loader.gif" class="jewelLoading "/></li>
</ul>
руководствовался уроками взятыми с интернета но нечего не вышло. может кто знает как можно организовать подгрузку контента в определенный блок как на facebook. ЗА РАНЕЕ СПАСИБО!!!
|