Используйте переходы CSS3 с градиентным фоном ⇐ CSS
Используйте переходы CSS3 с градиентным фоном
Я пытаюсь выполнить переход при наведении курсора мыши на миниатюру с помощью CSS, чтобы при наведении курсора градиент фона исчезал. Переход не работает, но если я просто изменю его на rgba() значение, оно работает нормально. Градиенты не поддерживаются? Я тоже пробовал использовать изображение, оно тоже не меняет изображение.
Я знаю, что это возможно, поскольку в другом посте кто-то это сделал, но не могу понять, как именно. Любая помощь> Вот CSS для работы:
#container div a { -webkit-transition: фон 0,2 с линейный; -moz-transition: фон 0,2 с линейный; -o-переход: фон 0,2 с линейный; переход: фон 0,2 с линейный; позиция: абсолютная; ширина: 200 пикселей; высота: 150 пикселей; граница: 1 пиксель #000 сплошная; поле: 30 пикселей; z-индекс: 2 } #container div a:hover { фон: -webkit-gradient(radial, 100 75, 100, 100 75, 0, from(rgba(0, 0, 0, .7)), to(rgba(0, 0, 0, .4))) }
Я пытаюсь выполнить переход при наведении курсора мыши на миниатюру с помощью CSS, чтобы при наведении курсора градиент фона исчезал. Переход не работает, но если я просто изменю его на rgba() значение, оно работает нормально. Градиенты не поддерживаются? Я тоже пробовал использовать изображение, оно тоже не меняет изображение.
Я знаю, что это возможно, поскольку в другом посте кто-то это сделал, но не могу понять, как именно. Любая помощь> Вот CSS для работы:
#container div a { -webkit-transition: фон 0,2 с линейный; -moz-transition: фон 0,2 с линейный; -o-переход: фон 0,2 с линейный; переход: фон 0,2 с линейный; позиция: абсолютная; ширина: 200 пикселей; высота: 150 пикселей; граница: 1 пиксель #000 сплошная; поле: 30 пикселей; z-индекс: 2 } #container div a:hover { фон: -webkit-gradient(radial, 100 75, 100, 100 75, 0, from(rgba(0, 0, 0, .7)), to(rgba(0, 0, 0, .4))) }
-
- Похожие темы
- Ответы
- Просмотры
- Последнее сообщение