При наведении на картинку появляется текст или кнопка

При наведении на картинку появляется текст или кнопка. Css решение

Иногда очень нужно создать область скрытого контента. При этом, если пользователь наведет на область или картинку мышью — показывалась кнопка или текст. Дизайн студия «Движок» нашли простое решение. Подробнее в этой небольшой статье.

Наглядный пример - http://jsfiddle.net/85Ya5

HTML код:

Css:

.holder{
position:relative;
width:300px;
height:400px;
}
.block{
position:absolute;
left:0;
bottom:0;
right:0;
background:rgba(255,255,255, 0.7);
padding:20px;
display:none;
}
.holder:hover .block{
display:block;
}

Пример использования — реализовали что бы при наведении на фото сотрудников появлялась кнопка вызова формы — где можно написать отзыв про сотрудника компании:
11.07

Если вы знаете другие решения — просим поделится ими в комментариях.

Вот и все, если Вы хотите «поблагодарить» наше IT сообщество — у вас есть такая возможность: справа есть варианты для пожертвований на развитие портала. Или поделитесь статьей в ваших соц.сетях через сервис ниже.

Отправить ответ

Please Login to comment
Войти с помощью: 
  Subscribe  
Notify of
Authorization
*
*
Войти с помощью: 
Registration
*
*
*
Войти с помощью: 

two + twenty =

Password generation