我想更改 div 的不透明度,然后将其向上或向下滑动以查看其内容,但滑动动画的行为非常奇怪,如下所示:
但是,如果我在 click 函数中删除了 fadeTo,则滑动会正常工作。
我在这里缺少什么来使#user_box div 更改不透明度然后滑动?
标记:
<div id="user_bar"></div>
<div id="user_box">
<a href="#">blah</a>
<a href="#">blah</a>
<a href="#">blah</a>
</div>
js:
$("#user_bar").hover(function(){
$(this).fadeTo(100, 0.5);
}, function(){
$(this).fadeTo(100, 0.7);
});
$("#user_bar").click(function(){
$("#user_box").fadeTo(0, 0.5);
$("#user_box").slideToggle();
});
CSS:
#user_bar {
height: 10px;
width:100%;
position: fixed;
top: 80px;
left: 0;
right: 0;
overflow:hidden;
cursor: pointer;
background-color: #000;
}
#user_box {
display:none;
width: 100%;
height: 50px;
position: fixed;
top: 90px;
left: 0;
right: 0;
overflow:hidden;
background-color: #000;
}