Меню для сайту Superfish
Шановні користувачі! Ми дякуємо Вам за те, що Вам цікавий наш контент, тому з кожним днем хочемо ставати все краще і краще!
Велике спасибі за вашу допомогу та уважність до нас!
По-перше, відразу варто відзначити, що меню призначене для широкого кола використання, є різні бібліотеки для його впровадження, а також велика кількість прикладів, як горизонтального меню, так і вертикального. Меню може бути як випадаючим, так і простим, причому ієрархія меню, що випадає, може бути як багаторівневою, так і одиночною.
 |  |
Посилання на офіційний сайтплагіна Superfish, представлене нижче в джерелі матеріалу, так що можете перейти і ознайомитися, а за одним завантажити сам плагін і встановити його собі, ну і відповідно, розібратися в ньому.
Перша частина. Підключення Superfish.
Не забуваємо також про бібліотеку jquery.js, наш файл скрипту з меню - menu.js та стилі demo.css за стандартом.
Друга частина. HTML.
Тепер за допомогою тегів ul li створюємо саме меню. Основному тегу ul даємо індефікатор menu та клас Superfish sf-menu. Також не забуваємо створити пункти підменю, що випадає.
Третя частина. CSS.
Переходимо до стилів, тут варто відзначити, що багато якостей просто обов'язкові для реалізації даного меню! Ну це, в принципі, і так зрозуміло, зрозуміло, що кожне меню забезпечується різними css-властивостями для різних красивих ефектів.
У підменю, що випадає, ми встановлюємо такі ж майже параметри, правда властивості трохи інші, за винятком тільки посилання при наведенні. Ми додаємо її заокругленість з правого нижнього боку, а також відтінки кордону.
Четверта частина. JQUERY.
Надамо нашому меню плавність випадання, приховування за подією, швидкість та інші js-властивості. Як Ви вже, напевно, могли зрозуміти, що скрипт працює з класом у меню в HTML - sf-menu і таким чином з ним і взаємодіє. Надаємо анімацію затримки, встановлюємо стрілочки підменю, що випадає, та й прописуємо швидкість випадання і приховування меню.
Також є безліч параметрів дляменю Superfish на офіційному сайті.