Блог

Главная - Вопросы по программированию - наведите курсор css, чтобы изменить значение непрозрачности другого элемента

наведите курсор css, чтобы изменить значение непрозрачности другого элемента

#html #css

#HTML #css

Вопрос:

 <div class="logoWrap">
<img src="https://i.imgur.com/OBFbjSK.png">
    <p class="logoDesc">this is img desc</p>
</div>

Я хочу избежать использования javascript, возможно ли изменить значение другого элемента с помощью:hover? если возможно, я хочу добавить переход.

http://jsfiddle.net/UH2Aq/

Комментарии:

1. Вы хотите изменить непрозрачность для какого элемента? когда мышь находится над каким элементом?

2. Вау, это было сложно…

Ответ №1:

Вы имеете в виду, что хотите, чтобы при наведении курсора на logoWrap отображался logoDesc?

Если это так: http://jsfiddle.net/wildandjam/emELN /

 .logoWrap:hover .logoDesc{
    opacity:1;
}

Затем, если хотите, вы можете добавить переход CSS3, чтобы сделать его более плавным.

Ответ №2:

Тот же ответ с переходом: http://jsfiddle.net/UH2Aq/1 /

 .logoDesc{

 transition: opacity .2s ease-in-out;
    opacity : 0;
}

.logoWrap:hover .logoDesc {
    opacity: 1;
}
Метки: