Главная » Файлы » Прочие скрипты » jQuery |
Простая динамическая подгрузка страниц через плагин AJAX Pagination на jQuery для uCoz
23.06.14, 15:00:47 | |
![]() Замечательное решение для тех, кто хочет подгружать нужный контент не переходя с одной страницы на другую. В качестве примера я использовал подгрузку страниц профилей пользователей Для начала посмотрите ДЕМО Установка: После /head вставляйте: Код <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> Следующий код в то место, где будет сам блок подгрузки: Код <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> <br clear="all" /><br clear="all" /> <br clear="all" /><br clear="all" /> <br clear="all" /><br clear="all" /> Залейте стиль из прикреплённого архива в папку css и картинку в папку images Материал подготовлен Apocalypse | |
Просмотров: 776 | Загрузок: 0 | |
Всего комментариев: 0 | |
| |