Здравствуйте.
Имеется такая конструкция:
<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, первая картинка дисплей: ноне, а вторая блок.
Однако конструкция не работает, при наведении на маску ничего не происходит, кто подскажет в чём может быть проблема?
сорри, сейчас нет возможности выложить код.
Простой
Средний
