Отображение текста при наведении курсора в Squarespace // Учебное пособие по Squarespace — эффект... скачать в хорошем качестве

Отображение текста при наведении курсора в Squarespace // Учебное пособие по Squarespace — эффект...

Наведите курсор на изображение — увидите текст. Звучит просто, правда? Что ж, благодаря CSS, это действительно так. Этот урок научит вас, как создать этот эффект при наведении курсора в Squarespace. - - Узнайте больше о пользовательском коде для Squarespace в моём бесплатном уроке по ссылке https://insidethesquare.co/learn - - Этот урок научит вас, как создать эффект при наведении курсора на изображение, который будет показывать текст. Он предназначен для последней версии Squarespace, известной как 7.1, и не будет работать в более старых версиях, основанных на 7. Этот урок состоит из пяти основных шагов: Шаг 1: Добавьте изображение Шаг 2: Добавьте текст Шаг 3: Получите идентификатор текстового блока Шаг 4: Настройте код ниже Шаг 5: Отредактируйте мобильное представление, поскольку при наведении курсора нет, поэтому нам нужно сделать это представление привлекательным! Вот расширение для Chrome, о котором я упоминаю в видео. Я не связан ни с этим, ни с его создателями, просто фанат: https://chrome.google.com/webstore/de... Вот руководство по коду. Обязательно измените идентификатор блока, чтобы он совпадал с идентификатором вашего текстового блока, и не стесняйтесь менять время перехода! @media only screen and (min-width: 640px){ #block-12345 { opacity: 0; transition: opacity 1s } #block-12345:hover { opacity: 1; Переход: непрозрачность 1 с } } - - 💸 ПОЛУЧИТЕ СКИДКУ 10% НА ПЕРВЫЙ ГОД ПОДПИСКИ НА SQUARESPACE 💸 Используйте мою партнёрскую ссылку и код PARTNER10 — вы сэкономите 10% на первой годовой подписке, а Squarespace заплатит мне небольшую комиссию за то, что я вас к ним привлечу 😎 🔗 PARTNER10 → https://insidethesquare.co/partner10 - - 🤩 Скачайте более 100 страниц пользовательских кодов и профессиональных советов по настройке Squarespace в одном потрясающем PDF-файле. Закажите шпаргалку по CSS для Squarespace, которая уже доступна по адресу 👉 https://insidethesquare.co/css --- 🙋 Нужна помощь? Посетите ​https://insidethesquare.co/code-help​, чтобы узнать о моих текущих вариантах поддержки. --- 🥰 ПОДДЕРЖИТЕ МОЙ КАНАЛ → https://paypal.me/insidethesquare 💻 САЙТ → https://insidethesquare.co 📧 РАССЫЛКА → https://insidethesquare.co/email 🤳 INSTAGRAM →   / thinkinsidethesquare   👍 FACEBOOK →   / insidethesquare   📌 PINTEREST →   / insidethesquare   ---