4

こんにちは基本的に私はそれにカーソルを合わせると要素があり、下から上にスライドする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>
4

1 に答える 1

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");
            })    
          });​

デモ：http： //jsfiddle.net/mSWP8/7/

于 2012-11-14T00:00:49.863 に答える