Создаем концепт выпадающего меню для сайтаСоздание сайта начинается с разработки концепции на бумаге, обдумки всех мелочей и частиц сайта. Но каждый разработчик хочет сделать не просто сайт, а нечто уникальное, которое будет притягивать взор посетителей необычным решением той или иной задачи. С таким мнением мы подошли к реализации следующего урока в котором мы рассмотрим как создать концептуальное меню для сайта с использованием css и jquery. Несмотря на то, что это всего лишь концепт, но он успешно работает во всех последних версиях браузера, включая ослика IE, проверено мною лично.

Шаг 1. HTML

Приведенный ниже код не требует объяснения, так что я просто оставлю его здесь. Использование класса  .submenu  требуется для избавления от селектора  .menu ul:

Кроме того,  .cf  для очистки обтекания (clearfix).

Создаем концепт выпадающего меню для сайта

Шаг 2. CSS

Для начала необходимо добавить элементы очистки:

Затем сбрасываем отступы и стиль маркированного списка:

Основной код который отвечает за выпадание списка и позиционирование элементов:

Вот и все. Готово!

Материал взят из зарубежного источника. И представлен исключительно в ознакомительных целях.

Читайте также: