Jump to content
  • 0
Sign in to follow this  
povarkovajulia

Анимированная иконка меню

Question

Добрый день! Подскажите пожалуйста, как можно реализовать с помощью кода анимированную иконку меню в Muse. Есть виджеты, которые решают этот вопрос, но нужен код.

Я понимаю, что нужно прописать стили в свойствах страницы в head, а скрипт поместить в body, но не пойму к каким элементам на странице применять эти стили. Есть примеры сайтов на Muse с этим эффектом, но мне не удалось его "вытащить" из них. 

Здесь ссылка, но видят ее только участники клуба. Вступите в клуб по этой ссылке.

Здесь ссылка, но видят ее только участники клуба. Вступите в клуб по этой ссылке.

Share this post


Link to post

2 answers to this question

Recommended Posts

  • 0
1 час назад, povarkovajulia сказал:

Есть примеры сайтов на Muse с этим эффектом, но мне не удалось его "вытащить" из них. 

Всё там можно вытащить. Другое дело что никто не будет делать это за вас.

Даю подсказку. Кнопка состояния в которую помещены 3 прямоугольника. Задан плавный переход для активного состояния для каждого из прямоугольников. В активном состоянии верхний и нижний поворачиваются на 45 градусов и смещаются по оси Y.
Пример для верхнего:

Здесь ссылка, но видят ее только участники клуба. Вступите в клуб по этой ссылке.

Средний прямоугольник в активном состоянии - непрозрачность 0.

Здесь ссылка, но видят ее только участники клуба. Вступите в клуб по этой ссылке.

Более внимательно можете взглянуть  на стили в соответствующем файле css.

Здесь ссылка, но видят ее только участники клуба. Вступите в клуб по этой ссылке.
Здесь ссылка, но видят ее только участники клуба. Вступите в клуб по этой ссылке.
 
В кодпене не такое решение как на сайте. На сайте чистый css (что всегда предпочтительнее скриптов)

Share this post


Link to post

Новая статья

Как бесплатно получить специализированный хостинг для Adobe Muse сайта. Читайте новую инструкцию по этой ссылке.
Sign in to follow this  

×
×
  • Create New...