Простая динамическая подгрузка страниц через плагин Ajax Pagination на jQuery
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
<link rel="stylesheet" type="text/css" media="screen" href="/css/css.css" /> <script type="text/javascript"> $(document).ready(function(){ function showLoader(){ $('.search-background').fadeIn(200); } function hideLoader(){ $('.search-background').fadeOut(200); }; $("#paging_button li").click(function(){ showLoader(); $("#paging_button li").css({'background-color' : ''}); $(this).css({'background-color' : '#006699'}); $("#content").load("/index/8-" + this.id, hideLoader); return false; }); $("#1").css({'background-color' : '#006699'}); showLoader(); $("#content").load("/index/8-1", hideLoader); }); </script> |
2#: Следующий код в то место, где будет сам блок подгрузки:
1 2 3 4 5 6 7 8 9 10 11 |
<div class="search-background"> <label><img src="/images/loader.gif" alt="" /></label> </div> <div id="content"> </div> <div id="paging_button" align="center"> <ul> <li id="1">1</li><li id="2">2</li><li id="3">3</li><li id="4">4</li><li id="5">5</li><li id="6">6</li><li id="7">7</li><li id="8">8</li> </ul> </div> |