AJAX – это простоИтак, представим ситуацию – есть страница, к примеру каталог, в середине которой находится блок с обновляемым контентом.
<ul id="menu"> <li id="item1"><a href="#">Товар 1</a></li> <li id="item2"><a href="#">Товар 2</a></li> </ul> <div id="mainContent"> <div id="intro"> <p> </p> <p> </p> <h3>Каталог</h3> <p> </p> <p id="intro">Добро пожаловать в наш каталог!<br>Выберите раздел:</p> </div> <div id="article"></div> </div> Сверху у нас меню в виде списка ссылок. Блок с идом “intro” будет показываться только при заходе на страницу. Блок “article” будет содержать обновляемую информацию. Пока он пустой. Итак, код jQuery: $(document).ready(function(){
$('#article').hide();
$('#menu a').click(function(){ var id=$(this).parent().attr('id'); $('#intro').fadeOut(500); $('#article').load('ajax/'+id+'.html').fadeIn(1000); return false; });
}); Сначала прячем блок “article” с помощью одноименной функции. При клике на ссылку считываем идентификатор родителя (тега li) и заставляем расствориться блок “intro” со скоростью 500 миллисекунд. Потом подгужаем нужный файл из папки ajax, имя файла такое же как идентификатор – для удобства. Ну и наконец заставляем его появиться в течении одной секунды. Как видите ничего сложного – справится даже начинающий. Вернутся Вам будет интересно:
|
- Публикации
Итак, у вас имеется свой собственный форум, но его никто не посещает? Мы готовы помочь вам справиться с этой нелегкой проблемой.
Данная статья в основном рассчитана на тех, кто самостоятельно занимается продвижением своего проекта.
Проклял все настройки кодировок, проклял DirectAdmin и еле-еле нашел то место где располагается и задается общий пароль для ...
Твиттер уже давно стал из нового web 2. 0 сервиса рекламной площадкой с огромным количеством потенциальных пользователей ...
Самое время кратко описать, чем нам придется заниматься. Прежде всего нужно понять, что блог ты будешь делать для получения ...
Долго не знал с чего начать данную статью. Статья что-то типа мыслей вслух и философии.