Зроби цей світ краще 👇 👇 👇
🇺🇦 Фонд Притули – https://prytulafoundation.org/
🇺🇦 Стерненко – https://www.sternenkofund.org/
👻 На розвиток каналу Frontend Shinobi
БАНКА – https://send.monobank.ua/jar/5tEodxQoEu
Крипта – USDT 0x284eF2F4db8B27905d68bBBECBC95a119259A395
https://codepen.io/bookamba/pen/myVpMbX
https://codepen.io/LukyVj/pen/PwwrYRR
⏱ Таймкоди:
00:00 — вступ
00:1:00 — як працює CSS анімація що слідкує за курсором
00:6:12 — CSS before – додаємо
00:7:30 — CSS position anchor
00:8:50 — як встановити anchor-name on hover?
00:10:52 — згадування про відео про те як працює anchor-position
00:13:10 — як анімувати anchor-name ?
00:19:20 — як вказати затримку для анімаціі?
Опис відео роліка:
У цьому відео покажу, як зробити анімацію кнопки на чистому CSS, яка слідкує за курсором миші — світло або градієнт усередині кнопки рухається саме за позицією курсора. І все це без жодного рядка JavaScript.
🔹 Що побачите у відео:
• Як створити базову HTML-розмітку для кнопки.
• Як налаштувати градієнт, що рухається за мишею.
• Як зробити плавний ефект пересування світла всередині кнопки.
• Як зробити це все тільки на CSS.
💡 Ідеально для тих, хто хоче навчитися створювати сучасні інтерактивні ефекти без JavaScript — лише силою CSS.
Оригінал –
🔔 Підписуйтесь на канал, ставте лайк 👍 і діліться відео з друзями
#css #html #js #курсиCSS #урокиCSS #CSS #ButtonAnimation #NoJavaScript #UkrainianFrontend










































































Будьте першим, хто прокоментує