divs调整大小和覆盖jquery

Question

我创建了一个包含 4 个 div 的容器。我需要在悬停时更改 div 的大小并覆盖其他 div。

这里有一个演示http://jsbin.com/ecuzof/113/edit

问题：我希望底部 div 从下到上而不是像现在一样从上到下增长。

有可能吗？ 谢谢 G.

Answer 1

Working Example

您可以将 bottom 设置为 0，然后 div 将从底部向上设置动画。另外，请注意我创建了两个事件 - 一个用于顶部 div，一个用于底部集合。

$(".riga .hoverific").hover(function() {
  $(this).stop().animate({
    width: "70%",
    height: "70%",
    backgroundColor: "lightBlue"
  }).css({'z-index':'3'});
}, function() {
  $(this).stop().animate({
    width: "50%",
    height: "50%",
    backgroundColor: "silver"
  }).css({'z-index':'1'});
});


$(".riga2 .hoverific").hover(function() {
  $(this).stop().animate({
    width: "70%",
    height: "70%",
    bottom: "0%",
    backgroundColor: "lightBlue"
  }).css({'z-index':'3'});
}, function() {
  $(this).stop().animate({
    width: "50%",
    height: "50%",
    backgroundColor: "silver"
  }).css({'z-index':'1'});
});