Question

我有5个带图像的元素和一个带有图像描述的特殊div。现在，如果我悬停在第一个li元素上。它应该显示div从图像前面向下滑动。我使用此代码

在动画中将css TOP值从-1px更改为-142px

    $('#middle li img').mouseover(function(e){
     $(this).next('div').animate({top:"-142px"},{queue:false,duration:350});
    });
    $('#middle li img').mouseout(function(e){
     $(this).next('div').animate({top:"-1px"},{queue:false,duration:350});
   });

但是当我盘旋在街区时。 div自动向下滑动。我不能稳定

这里也是HTML

    <li style="overflow:hidden;height:141px;width:174px" id="cat-<?php echo $data['ID']; ?>" class="category"  onclick="window.location.href='<?php echo $data['link']; ?>';">
                <img id="img-<?php echo $data['ID']; ?>" src="<?php echo $data['image'] ?>" style="width:140px;height: 140px">
                <div class='abc' id="div-<?php echo $check; ?>" style="background-color:white;position:relative;width:135px;height: 135px;border: 3px solid black;top:-1px">
                <div class="head" style="margin :0 3px 0 3px;border-bottom:1px solid black"><h1 style="color: black;font-size: 13px;margin: 5px 0 15px 0;line-height: 20px;"><?php echo $data['title']; ?></h1></div>
                <div class="bdy" style="margin :0 3px 0 3px"><p style="margin-top:10px"><?php echo $data['content'] ?> </p></div></div>
            </li>

当鼠标悬停在img上时，我需要为每个li显示div（.abc）

任何建议..

转到http://www.jehovahswitnessblog.com/并检查主滑块

下的5个框

悬停时的JQuery动画问题

0 个答案: