У цій статті я покажу, як створити просте горизонтальне меню, що випадає.
![Як створити горизонтальне меню, що випадає на jquery (горизонтальне) Як створити горизонтальне меню, що випадає на jquery](https://images-on-off.com/images/132/kaksozdatgorizontalnoevipadayusheemenyun-83ec0b90.jpg)
У цьому підручнику я спробую зробити все просто і зосередитися на меню, а деякі елементи, на кшталт відображення кнопки посилання і шрифту, я залишу для наступного підручника.
Також скачайте исходники собі на комп'ютер!
![Як створити горизонтальне меню, що випадає на jquery (просте горизонтальне меню, що випадає jquery) Як створити горизонтальне меню, що випадає на jquery](https://images-on-off.com/images/132/kaksozdatgorizontalnoevipadayusheemenyun-dc3ce824.jpg)
Сучасні тенденції і підходи в веб-розробці
Дізнайтеся алгоритм швидкого професійного зростання з нуля в сайтобудування
1. Фонове зображення для навігації
Ми почнемо з кадрування фонового зображення, виберемо всю висоту фону навігації, а на ширину нам відмінно вистачить 5 пікселів, щоб зробити CSS repeat-x.
![Як створити горизонтальне меню, що випадає на jquery (меню) Як створити горизонтальне меню, що випадає на jquery](https://images-on-off.com/images/132/kaksozdatgorizontalnoevipadayusheemenyun-0b16bee2.jpg)
2. Права пунктирне обрамлення
Для основного і меню, що випадає обидва правих пунктирних обрамлення не однакові, так що нам потрібно обрізати обидві пунктирні окантовки і зберегти їх як зображення.
![Як створити горизонтальне меню, що випадає на jquery (горизонтальне меню, що випадає) Як створити горизонтальне меню, що випадає на jquery](https://images-on-off.com/images/132/kaksozdatgorizontalnoevipadayusheemenyun-cd25cfc7.jpg)
3. Створюємо розмітку HTML
Як тільки зображення для горизонтального меню, що випадає будуть готові, таку дію ми створимо розмітку HTML.
Як видно, під кожним батьківським тегом li міститься список подтегов li, які стануть списком випадають посилань.
4. Меню, що випадає jQuery
5. CSS для горизонтального меню, що випадає
Важливий момент, який слід взяти на замітку: для того, щоб це горизонтальне меню, що випадає на jQuery працювало правильно в Internet Explorer 6 (IE 6), вам доведеться встановити фіксовану ширину для #ddmenu li ul, щоб невпорядкований список був достатньої ширини для підтримки горизонтального списку в IE 6.
![Як створити горизонтальне меню, що випадає на jquery (меню, що випадає jquery) Як створити горизонтальне меню, що випадає на jquery](https://images-on-off.com/images/132/kaksozdatgorizontalnoevipadayusheemenyun-c040c80b.png)
Редакція: Ріг Віктор і Андрій Бернацький. Команда webformyself.
![Як створити горизонтальне меню, що випадає на jquery (випадає) Як створити горизонтальне меню, що випадає на jquery](https://images-on-off.com/images/132/kaksozdatgorizontalnoevipadayusheemenyun-dc3ce824.jpg)
Сучасні тенденції і підходи в веб-розробці
Дізнайтеся алгоритм швидкого професійного зростання з нуля в сайтобудування
Найсвіжіші новини IT і веб-розробки на нашому Telegram-каналі
Хотів давно таке зробити, просто випадає виходило, а таке немає так що спасибі
ЗИ, На мою урок не дуже правельно написано! Спочатку лечшеб КСС розглянув і з поясненнями? Адже не всі розуміють в цьому, я б напевно не чого і не навчився без пояснень (на початку навчання дає талчок, типу «про я все зрозумів, це прото», а не «млинець, апять це» float: none; "де його шукати, о ні. ») Потім резметку, ну і jQuery.