Задать вопрос
@Martyer

Почему не срабатывает hover эффект в данной конструкции?

Здравствуйте.
Имеется такая конструкция:
<div class="child-3">
				<div class="mask mask3"></div>
				<img src="img/child3.png" alt="child3" />
				<img src="img/ch3.png" alt="ch3" class="ch ch3" />
			</div>


Блок child-3 имеет position: relative, первая и вторая картинка имеет position: absolute и позиционирование с помощью top и left, только вторая картинка с классом ch ch3 имеет display: none.
Была задача сделать чтобы при наведении на первую картинку, она приобретала display: none, ав этот же момент вторая display: block, однако возникли проблемы(изображения наложены друг на друга и при наведении на одну, мигает несколько) и было решено сверху наложить маску<div class="mask mask3"></div> и задать ей также абсолютное позиционирование, только сделать каждую маску шириной и высотой равной открытой части её картинки (той части, на которую не наложена другая картинка). Ну и дальше при наведении на mask1, первая картинка дисплей: ноне, а вторая блок.
Однако конструкция не работает, при наведении на маску ничего не происходит, кто подскажет в чём может быть проблема?

сорри, сейчас нет возможности выложить код.
  • Вопрос задан
  • 1097 просмотров
Подписаться 1 Оценить Комментировать
Пригласить эксперта
Ответы на вопрос 2
aliencash
@aliencash
Партизан
codepen.io/aliencash/pen/dMopMx
совсем не понимаю зачем такой огород городить...
Ответ написан
Don_Donald
@Don_Donald
Зачем вам по 2 класса?? Мигает наверно что у вас один и тот же момент срабатывают два ховера
Вот пример не чего не мигает, с разных размеров codepen.io/anon/pen/pyJEyp?editors=1100
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы