用jquery打开一个特定位置的div

时间:2013-07-18 10:51:14

标签: jquery html css

我已经创建了2个div,第二个div在第一个div内部悬停打开但是我将第二个div的位置增加到第一个div的两倍并且在一个盒子中我有这样的8个div所以我想要所有的第二个div打开到盒子的身体,所以我怎么能设置底部的div的位置从下到上打开,这意味着它不应该穿过盒子的主体

我的代码:

<html>
<head></head>
<body>
    <div class="boxes">
     <div class="box1">
      <div class="box_onhov">
        this div will be appear on hovering the box1 and its double in size of box1
      </div>
     </div>
     <div class="box2">
      <div class="box_onhov">
       this div will be appear on hovering the box1 and its double in size of box1
     </div>
        .
        .
        .
        .
     <div class="box8">
      <div class="box_onhov">
       this div will be appear on hovering the box1 and its double in size of box1
      </div>
     </div>
</body>
</html>

这些盒子在一行中调整为4,所以当在第一个div上盘旋时,div_onhov会覆盖它并在它底部的div,所以当悬停在底部div上意味着在div 5上因此它不应该越过身体并且必须显示底部到最佳。与第4个div相同,不应该向右显示它必须显示在左边的外部div内。

1 个答案:

答案 0 :(得分:0)

这可以帮助您制作动画宽度或高度

$('.box1').hover(function(){
  $(".box_onhov").toggle(function(){
  $(.box_onhov).animate({height:40},200);
  },function(){
  $(.box_onhov).animate({height:0},200);
  });
});