Выпадающее меню с анимацией
HTML-код
- Опубликовано: 5 окт 2016
- На курсе углубленного HTML5 и CSS3 мы рассматриваем значения CSS-свойства display. Одни из них table и table-cell. Используя эти значения и свойство transition с псевдоклассом :hover можно добиться построения красивой анимации в работе выпадающего меню
pastebin.com/knVNe97C
Идеально, объяснения практически каждого шага, а также пояснение почему так, а не иначе + ко всему прочему приятно, что нет на фоне никакой музыки, лишь голос. Также понравилось, то что при сталкивании с какой-то неожиданной проблемой, вы (снова) всё объясняли, слишком шикарные уроки. Спасибо.
Спасибо
как такое меню сделать в центре экрана?
Верстаю на bootstrap и мне нужно чтоб это меню не растягивалось на весь экран. а было фиксированно в центре и плюс адаптивное было
центровку можно сделать margin:auto, а растяжение убрать display:inline-block. Адаптивность реализуется медиа запросы. Покажете свой код через codepen.io? Или скрин того, как вид должен быть
Здравствуйте, скажите, пожалуйста, а как реализовать выпадение списка не через px, а через %? Т. е. у меня есть несколько подобных меню (каждое своего размера), и по нажатия кнопки над меню оно должно сворачиваться или разворачиваться. А для каждого меню указывать в px отдельно, скажем так, невозможно. Нужно, чтобы была одна js-функция, которая сворачивает их. Как сделать так, чтобы height: 100% был, а не 200px? Заранее спасибо.
Я уже нашёл способ. Просто задаю высоту = Element.scrollHeight
Добрый день.
Урок хороший но как сдвинуть меню по середине вниз чтобы оно было не на верху экрана.
И как можно сделать чтобы второе меню тоже было горизонтальным.
Можете подсказать как сделать вот такое мню как по этой ссылки
hkar.ru/PFQ6
codepen.io/anon/pen/Ogggbj, но без JavaScript или анимации пользователю будет неудобно работать с таким меню - оно "скачет". Чтобы меню не было в самом верху экрана, можно задать ему верхнее поле, но на практике надо смотреть какое окружение меню - потому что сейчас margin зададим, а неизвестно что надо будет ещё потом менять
Добрый день
можете подсказать а как сдвинуть текст меню так как на картинке