X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость (

| Вход | Регистрация )

Открыть тему
Тема закрыта
> как при наведении на блок div зажечь внутри этого блока кнопку
Neptun_hb
Neptun_hb
Topic Starter сообщение 15.1.2019, 19:32; Ответить: Neptun_hb
Сообщение #1


Здравствуйте!
Подскажите пожалуйста, не выходит каменный цветок :-(
Задача такая: Есть несколько небольших div блоков с описанием и картинками. Внизу каждого есть кнопка. Которая пока загорается только при наведении на нее курсора. А надо чтобы она зажигалась при наведении курсора на родительский div.
Вот код если интересно
<div class="tovar">
<img src="img/reg.jpg">
<h4>Заголовок товара</h4>
<center> <div class="line"></div>
<h5>Текст</h5></center>
<br>
<div class="button" aligh:"center">ПОДРОБНЕЕ</div>
</div>

[CSS]
.tovar{
float:left;
background:white;
width: 293px;
height: 340px;
margin-left:20px;
margin-right:20px;
margin-bottom:40px;
border:1px solid #d8d8d8;
display:inline;
}
.tovar:hover{
border:1px solid #346AE8;
}
.line{
border: none; /* Убираем границу */
background-color: #d8d8d8; /* Цвет линии */
color: #d8d8d8; /* Цвет линии для IE6-7 */
height: 1px; /* Толщина линии */
width: 90%;
}
.button{
color:#346AE8;
border:2px solid #346AE8;
width:150px;
font-weight: bold;
text-align:center;
margin-bottom:20px;
margin-left:20px;
padding-top:5px;
padding-bottom:5px;
transition: 0.15s linear;
}
.button:hover{
background: #346AE8;
color:white;
}
[/CSS]

Спасибо!
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Degradator
Degradator
сообщение 16.1.2019, 13:31; Ответить: Degradator
Сообщение #2


button {
background: blue;
}
div:hover > button {
background: yellow;
}

https://code.tutsplus.com/ru/tutorials/the-...rize--net-16048
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Neptun_hb
Neptun_hb
Topic Starter сообщение 17.1.2019, 15:33; Ответить: Neptun_hb
Сообщение #3


(Degradator @ 16.1.2019, 16:31) *
button {
background: blue;
}
div:hover > button {
background: yellow;
}

https://code.tutsplus.com/ru/tutorials/the-...rize--net-16048


ОФИГЕННО!!!!!! Спасибо тебе милая обезьянка :rolleyes: (я про аватар ;-) )
Даже и представить не мог, что Css умеет строить логические цепочки.

Для тех, у кого будет похожий вопрос поясню элементарные вещи по синтаксису, которые у меня сразу не получились, и я немного тупил

div.tovar:hover > .button { }

То есть без всего div, потом в зависимости от класса или идентификатора решётка или точка название , ну и так далее

Еще раз спасибо тебе.!
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Neptun_hb
Neptun_hb
Topic Starter сообщение 17.1.2019, 23:36; Ответить: Neptun_hb
Сообщение #4


Прошу еще раз прощения, появилась идея, подскажите, реализуема ли она в css?
Код тот же. И теперь при наведении на основной блок, зажигается и кнопка. А можно ли выстроить логику, чтобы при нажатии на основной блок, нажималась и сама кнопка?
то есть сейчас действие срабатывает непосредственно при нажатии на кнопку, а хотелось бы на сам блок. Для реализации я вижу 2 варианта:
1. Это прописать какую-то логику, связывающую Hover на кнопке и основном блоке
2. ну либо привязывать всё основное действие на основной блок:hover. Конечно это наверное, самый простой способ, но интересно попробовать реализовать по другому.

Или это извращение? :unsure:
Спасибо
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Salikhoff_hb
Salikhoff_hb
сообщение 18.1.2019, 4:03; Ответить: Salikhoff_hb
Сообщение #5


Neptun, так ты попробуй оба варианта сперва, зачем же писать не проверив

Замечание модератора:
Эта тема была закрыта автоматически ввиду отсутствия активности в ней на протяжении 100+ дней.
Если Вы считаете ее актуальной и хотите оставить сообщение, то воспользуйтесь кнопкой
или обратитесь к любому из модераторов.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Открыть тему
Тема закрыта
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Открытая тема (нет новых ответов) Большие ставки для кликов в Я.Директ. Как удешевить?
2 rownong27 1119 26.3.2024, 14:13
автор: knezevolk
Открытая тема (нет новых ответов) Как вы бросили работу и перешли на заработок с сайтов?
12 uahomka 2289 25.3.2024, 6:52
автор: Skyworker
Открытая тема (нет новых ответов) Как отозвать банковский платеж фрилансеру?
28 metvekot 3913 25.3.2024, 6:34
автор: Skyworker
Открытая тема (нет новых ответов) Как вывести деньги в Украине с заблокированного Юмани ?
23 freeax 3638 24.3.2024, 20:55
автор: Liudmila
Открытая тема (нет новых ответов) Через какой браузер и как можно найти в кэшэ браузера видео
10 Room 1932 23.3.2024, 7:41
автор: Room


 



RSS Текстовая версия Сейчас: 28.3.2024, 23:08
Дизайн