Розглянемо приклад створення ефекту оригінального і динамічного меню LavaLamp яке безсумнівно стане в нагоді, адже іноді симпатичні дрібниці в дизайні просто необхідні.
LavaLamp це ефект оригінального і динамічного меню.
Просто подивіться приклади і самі все зрозумієте.
Цей ефект мені завжди дуже подобався, навіть трохи цікаво перший час погратися з подібними менюшками.
Реалізація цього меню неймовірно проста, а код меню буде що ні наїстися семантичного, звичайно нам понадобісться jQuery.
Створюємо саме меню:
Тепер підключаємо наші скрипти, вставивши цей код між тегами
:Можна вважати що меню вже готове, залишилося тільки оформити:
Подивитися приклад з трьома готовими менюшками в окремому вікні »
Так що качаємо і робимо красу. Всім удачі!
Ви напевно помітили, що якщо відвести курсор миші від меню, то шар підсвічування повертається до першого пункту. Справа в тому, що лаваламп вміє повертатися до потрібного пункту меню, і це можна зробити присвоївши потрібного пункту клас current, це робиться так:
Реалізація
Створюємо саме меню:
Тепер підключаємо наші скрипти, вставивши цей код між тегами
:Можна вважати що меню вже готове, залишилося тільки оформити:
Раніше я б наверника не зрозумів як це зробити, навіть з інструкцією - так що я викладу приклад з трьома готовими менюшками.
Так що качаємо і робимо красу ;-) Всім удачі!