Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 30.04.2016, 20:15
Новичок на форуме
Отправить личное сообщение для WoodStock Посмотреть профиль Найти все сообщения от WoodStock
 
Регистрация: 30.04.2016
Сообщений: 3

Плавная смена элементов HTML
Доброго времени!

Стоит следующая задача: кликаем на картинку а та в свою очередь плавно сменяется (прозрачностью) на div блок с текстом.

Заранее извиняюсь за наглось просить готового решения, но было бы очень здорово. Спасибо.
Ответить с цитированием
  #2 (permalink)  
Старый 30.04.2016, 20:37
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,055

WoodStock,

<style type="text/css">.hot{height:100px;width:100px;border:1px dashed Gray;padding:5px;position:relative;margin:0;padding:0}
.hot div{height:100px;width:100px;transition:all .8s;position:absolute}
.hot .img{background:url(http://f4.mylove.ru/gDbqe0mkIC.png);background-size:cover;opacity:1}
.hot .text,.hot.active .img{opacity:0}
.hot.active .text{opacity:1}
</style>
 <div class="hot" onclick="this.classList.toggle('active')"><div class="text">всякая фигня</div><div class="img"></div></div>
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Плавная смена background-image div-ва в котором есть контент phenom jQuery 1 09.04.2013 14:28
Функция для выборки html элементов potato Ваши сайты и скрипты 6 01.08.2012 01:55
Плавная смена нескольких картинок shurik330 jQuery 0 10.02.2012 15:10
Плавная смена картинок - как? petyaeva Элементы интерфейса 0 21.07.2010 16:16
Кто чем пользуется при создании html элементов vflash Общие вопросы Javascript 14 24.08.2009 21:12