[英]jquery animate opacity arrows mouseenter mouseleave
I'm trying to add an opacity effect with jquery when we past on arrows navigation but it seems that nothing happens :(. Do you know what's wrong with my Jquery script. 当我们过去使用箭头导航时,我正在尝试为jquery添加不透明度效果,但似乎什么也没发生:(。您知道我的Jquery脚本出了什么问题。
Here my Jquery : 这是我的Jquery:
$(document).ready(function(){
$(".flscroll").mouseenter(function(){
$("flscroll").animate({opacity:1},300);
});
$(".flscroll").mouseleave(function(){
$(".flscroll").animate({opacity:.8},300);
});
});
I defined my arrows like in my css : 我在css中定义了箭头:
.flscroll {
display:block;
height: 83px;
opacity: 0.8;
position: fixed;
top: 40%;
z-index: 1000;
}
.ie8 .flscroll {
filter: alpha(opacity=80);
}
#flscrollg {
background: url(images/sprite.png) no-repeat 50px -100px;
left: -30px;
padding-left: 50px;
width: 52px;
}
#flscrolld {
background: url(images/sprite.png) no-repeat left -200px;
padding-right: 50px;
right: -30px;
width: 53px;
}
My html arrows declaration is like that : 我的html箭头声明是这样的:
<a href="#1" title="previous" class="flscroll" id="flscrollg"> </a>
<a href="#1" title="next" class="flscroll" id="flscrolld"> </a>
So I mentioned in the comment that it might be your Jquery missing the fullstop in this line of code 所以我在评论中提到,这可能是您的Jquery在此行代码中缺少句点
$("flscroll").animate({opacity:1},300);
//Should be
$(".flscroll").animate({opacity:1},300);
I have added it in this FIDDLE and it works fine. 我已经在此FIDDLE中添加了它,并且效果很好。
Is this what you are after? 这是你所追求的吗?
try this 尝试这个
$(document).ready(function(){
$(".flscroll").on('mouseenter',function(){
$(this).animate({opacity:1},300);
}).on('mouseleave',function(){
$(this).animate({opacity:0.8},300);
});
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.