Анимирано меню

В този урок ще разгледаме създаването на анимирано меню с jQuery. Въпреки своята простота, изглежда много впечатляващо.

Стъпка 1.

Нека свържем рамката jQuery към нашия документ и веднага след това ще напишем необходимия скрипт, за да работи менюто.

Стъпка 2.

Самото меню, както обикновено, е неномериран списък. Поставете го на правилното място на нашата уеб страница:

За меню без фоново изображение ние даваме на списъка само идентификатораtopnav

и присвоете друг клас на версията с фоновото изображение, в този случайv2 :

Стъпка 3.

Най-важната част от това меню са CSS стиловете.

Текстова версия без фоново изображение:

за версията с фоново изображение, нека добавим още правила за стил v2:

Съответно тук трябва да промените пътя до файла с фоново изображение, ако не е в корена на сайта.

Всичко е готово! Надявам се това меню да бъде отразено във вашите сайтове.

Този урок е подготвен за вас от екипа на ruseller.com Източник на урока: www.sohtanaka.com Превод: Сергей Патин Урокът е създаден: 30 ноември 2009 г. Преглеждания: 68611 Правила за препечатване

5 последни урока от рубриката "jQuery"

jQuery анимация за писане

Днес бихме искали да ви разкажем за библиотеката TypeIt, безплатен плъгин за jQuery. С негова помощ можете да симулирате писане. Ако всичко е настроено правилно, можете да постигнете много реалистичен ефект.

Хронология с jQuery

jQuery плъгин за времева линия.

Начертайте диаграма на Гант

jQuery плъгин за диаграма на Гант.

AJAX и PHP: Качване на файл

Пример за това как да качите файл с помощта на PHP и jQuery ajax.