Все пользовались древним тегом <marquee>, у него есть недостатки, во-первых, он тормозит, во-вторых, он семантически неверен. И даже тут к нам приходит на помощью jQuery плагин - marquee. Приступим к делу!
Подключаем саму библиотеку jQuery и jQuery Marquee
HTML markup:
Эффект увеличения изображения как на флеше.
HTML:
Иногда возникает потребность в создании кнопки - вернуться назад для чайников, это можно реализовать следующим образом при помощи javascript'a:
Нужен слайдшоу для изображений или контента? Вам поможет jQuery плагин Cycle! С помощью этого плагина можно создавать ротаторы баннеров, контента, галерей. Ну что же, приступим к нашему уроку:
Первым делом подключаем jQuery (Желательно версии 1.3.2 и выше), плагин jQuery Cycle и jQuery Easing Plugin v1.1.1 (необязательно, но он расширяет количество эффектов.) В самом низу урока прикреплены эти файлы с демкой.
Плавная смена изображений при помощи jQuery.
HTML разметка:
Вывод формы логина при помощи модальных окон от jQuery.
Копался в интернете и нашел очень интересный эффект, возможно, уже банальный - это выезжающая панель с меню (Справа или слева в CSS настраивается). Для этого меню нам нужна будет сама библиотека jQuery, желательно версии 1.3.2. В архиве в конце статьи прикреплен файл, в котором есть сама библиотека jQuery 1.3.2. Итак, приступим к построению нашей выезжающей панели!
Разделим наш урок на 3 этапа:
HTML разметка нашего меню:
Если возникает надобность для кнопки указать ссылку при нажатии, то данный способ вам поможет.
Способ №1, если у пользователя отключен javascript:
В этом уроке мы рассмотрим использование замечательного скрипта от jQuery - Lava Lamp! Рассматривается пример данного скрипта в действии на Drupal. Итак, как всегда все распишу пошагово, ну что же, приступим! (Внизу урока прикреплены исходники скриптов, а также демки)
1. Подключаем наши js скрипты через .info файл вашей темы:
scripts[] = js/jquery.easing.min.js
scripts[] = js/jquery.lavalamp.min.js
2. Теперь в местах где мы выводим наше $primary_links или $secondary_links прописываем другие классы:
Пишем простой калькулятор на javascript.
Javascript:
Комменты