怎么处理层移入之后图片消失的问题
html
<div class="banner">
<a href="" class='layer'></a>
<div class='prev'></div>
</div>
css
.banner{position: relative;width: 200px;height: 200px;border: 1px solid #000;margin: 0 auto;}
.layer{float: left;width: 100px;height: 180px;border: 1px solid #000;}
.prev{opacity:0;width: 62px;height: 62px;position: absolute;top: 50px;left: 0;background: url(../images/leftarrow.jpg) 0 0 no-repeat;}
js
$('.layer').hover(function () {
$('.prev').animate({'opacity':'1'},40)
},function () {
$('.prev').animate({'opacity':'0'},40)
})
$('.prev').hover(function () {
$('.prev').css('opacity','1')
},function () {
$('.prev').animate({'opacity':'0'},40)
})
我想做到的效果是移入.layer层图片出现，从.layer移入图片.prev层图片不消失，现在为什么移入了.prev层图片会消失？该怎么写呢？
Dirky風
8 years, 11 months ago
Answers
鼠标
mouseover
和
mouseout
的一个坑。你鼠标移动到图片的时候就会触发一次
mouseout
，所以图片就隐藏了。使用
mouseenter
和
mousewheel
来代替前面两个事件：
$('.layer').on('mouseenter', function(){
$('.prev').animate({'opacity':'1'},40)
}).on('mousewheel', function(){
$('.prev').animate({'opacity':'0'},40)
})
fliland
answered 8 years, 11 months ago