падащо меню с jQuery
Здравейте мили приятели! Днес ще направим още едно падащо меню на jQuery с помощ, но този път това е направено със специален плъгин, наречен Superfish. За да започнете, вижте демонстрацията и изтеглете изходните файлове, които ще използваме в този урок:
Стъпка 1. Дизайн на HTML меню.
Първо, нека създадем html-рамка, която ще служи като основа за нашето бъдещо меню. По-долу е даден пример за такава рамка:
HTML:
Стъпка 2. Дизайн на менюто
CSS:
Стъпка 3. Промяна на рамката на jQuery
Сега основното нещо е да не забравяме да обвържем основната рамка на jQuery, защото ако я вмъкнем по-късно, менюто ни няма да се покаже правилно. Ще изглежда така:
След това ще накараме нашето меню да се плъзга плавно и ще придадем някои ефекти на елементите от падащото меню. За да не публикувам дълги javascript кодове тук, отделно преместих файла hoverIntent.js, който ще отговаря за плавния външен вид на елементите от менюто, и superfish.js, който отговаря за работата на самия плъгин Superfish! Публикувах тези файлове в изходния код на урока. Те са в папката JS. Изтеглете и се наслаждавайте! Сега трябва да обвържем тези файлове с нашия документ, където ще се намира менюто. Правим това, като вмъкваме следния код между таговете и:
Стъпка 5. Ощипвания на jQuery
И накрая, последният и най-важен етап за работата на менюто. За правилно показване трябва да напишем следния малък javascript код между таговете и:
Заключение.
Този урок е подготвен за вас от екипа на ruseller.com Източник на урока: www.tpg.com.au Превод: Максим Курочкин Урокът е създаден: 12 юни 2009 г. Прегледи: 113920 Правила за препечатване
5 последни урокарубрика "jQuery"
jQuery анимация за писане
Днес бихме искали да ви разкажем за библиотеката TypeIt, безплатен плъгин за jQuery. С негова помощ можете да симулирате писане. Ако всичко е настроено правилно, можете да постигнете много реалистичен ефект.
Хронология с jQuery
jQuery плъгин за времева линия.
Начертайте диаграма на Гант
jQuery плъгин за диаграма на Гант.
AJAX и PHP: Качване на файл
Пример за това как да качите файл с помощта на PHP и jQuery ajax.