Постепенно се отваря менюто с помощта на JQuery, дизайн и развитие на сайта
Добър ден 🙂
Както обещах в последната статия, днес ще ви покаже как да се постигне плавен откриване на ефекта от падащото меню, но вече не с помощта на CSS, и благодарение на JQuery. Методът също е често срещано явление и своевременно, аз често го използва. Но само, че както всеки скрипт, този метод създава дори и минимална, но все още допълнителна тежест на сайта. Ако не се притеснявате за това на всички, а след това нека да стигнем до изпълнението на нашата гладка падащо меню. Но преди това, нека да погледнем какво се случва в края на краищата.
Просто, които се интересуват да погледнете предишния метод за използване на CSS, която е описана в статията - Внимателно се отваря меню с CSS
Сега, за бизнеса. Както и в последната статия, на първо място, нека да напише HTML код за нашето меню. Код takoyzhe като в тази статия, за да се избегне объркване и да бъде по-добре разбрано. Меню с две позиции и двете имат подменюта.
На следващо място, се пристъпва към скриптовете. И както обикновено, първо се свържете на JQuery библиотеката. Капачката преди главата на затваряне или в мазето преди zakryvayuschimsyabody добавите този код тук.
Ако имате такава линия, или подобен, който вече е свързан библиотека, след това отново това не си струва.
На следващо място, сценарият, който ще направи анимацията изглаждане отваряне на падащото меню. се добавя Този код веднага след библиотеката.
Във втория ред на скрипта посочи Haydee нашето меню. Ако използвате този метод, за да си собствено меню, то е естествено да се промени името на собствените си. В този случай - #slow_nav.
Можете дори да персонализирате анимацията. В този сценарий за отваряне и затваряне на стойността е 400 милисекунди, е 0.4 секунди. Ако искате можете да промените към по-висока стойност, или по-малко.
Последната стъпка е да се добавят стилове. Те са много сходни стилове от последната статия, но те нямат свойствата на CSS анимации.
Той също така стилове се добавя нов ред, с който сценария работи правилно. За един елемент - дисплей #slow_nav ли ул определен имот: няма. Ако не добавите падащото меню първоначално ще се види и ще изчезне само след курсора върху него. Всички останали същите стилове като предишната статия.
Като последен метод, а това може да се прилага не само към менюто samopisnaya но също така и на същите динамични менюта, които са създадени със системи за управление на съдържанието, като WordPress. За да направите това, вие се нуждаете от малко докосване до стилове и всички. Това е първият, който използва HTML код не е необходимо, само на стиловете. В стила, който искате да смените името Haydee #slow_nav на факта, че вие ще бъдете добре, може би нещо друго ощипване на малките неща. Няма да се впускам в подробности. За всеки случай се нуждае от индивидуален подход, така че съжалявам 🙂
Това е всичко, благодаря ви за вниманието. 🙂
Ако сте били от полза за работата си, можете да подкрепят сайта :)
Здравейте скъпи приятели
Имате AdBlock инсталирано разширение или други подобни. Добавете сайта си в белия списък, и по този начин да допринесе за vnesesh неговото развитие. Инструкции за това как да деактивирате AdBlock искат този прозорец