嗨,基本上我有一个元素,当我将鼠标悬停在它上面时,我有一个从底部向上滑动的div,当我停止在元素上方停留时,div会向下滑动。
目前我已经开始工作,但是在奇怪的情况下,上下滑动的div卡住了,上下滑动被反转,我不明白为什么。通过反转我的意思是当我没有悬停div元素时,然后当我悬停时它向下滑动。
目前让元素停止这样做的唯一方法是刷新。
任何人都可以指导我解决这个问题吗?
非常感谢
代码: JAVA SCRIPT
$(document).ready(function ()
{
$("div.small_info_container").hover(function ()
{
$(this).parent().find('div.small_slide_info_container').slideToggle("fast");
});
});
CSS:
.elem {
width: 248px;
height: 238px;
margin: 10px 0 0 5px;
float: left;
border: 1px solid #ACACAC;
background: white;
box-shadow: 3px 4px 2px -2px #CACACA;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
.small_info_container {
position: absolute;
width: 248px;
height: 238px;
background:transparent;
}
.small_slide_info_container {
position: absolute;
width: 248px;
height: 45px;
background: rgba(173, 173, 173, 0.36);
display: none;
bottom: 0;
}
HTML
<div class="elem">
<div class="small_info_container">
<div class="small_slide_info_container">
</div>
</div>
</div>
答案 0 :(得分:2)
试试这个......
$(document).ready(function ()
{
$("div.small_info_container").mouseover(function () {
$(this).parent().find('div.small_slide_info_container').stop().slideDown("fast");
}).mouseleave(function(){
$(this).parent().find('div.small_slide_info_container').stop().slideUp("fast");
})
});