Эффект Gooey при наведении на кнопку

Разработка Эффект Gooey при наведении на кнопку

Нет прав для скачивания
Эффект Gooey при наведении на кнопку.
Пишем код HTML:
HTML:
<button data-gooey>Hover over me</button>
<button data-gooey>Gooey, eh?</button>
<button data-gooey>
  <a href="https://garet.io" target="_blank">garet.io</a></button>
Пишем стиль для кнопок:
SCSS:
$bgColor: papayawhip;
$buttonColor: dodgerblue;
$buttonTextColor: white;

body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100vh;
  background: $bgColor;
  margin: 0;
  padding: 0;
}

button {
  background: $buttonColor;
  border: none;
  padding: 15px;
  font-size: 20px;
  color: $buttonTextColor;
  cursor: pointer;
  margin: 40px 0;

  &:focus {
    outline: none;
  }

  a {
    color: inherit;
    text-decoration: none;
  }
}
Добавляем jquery:
JavaScript:
gooeyButtons();
Смотрим наш результат:
13667
Автор
baltun
Скачиваний
0
Просмотры
643
Первый выпуск
Обновление
Рейтинг
0.00 звёзд Оценок: 0

Ещё ресурсы от baltun

Похожие ресурсы
Назад
Верх Низ