1

以上基本上是我的问题。我已经浏览了关于 SO 的其他一些问题，但最接近的一个是大约1 个元素，它不必位于中心。

我基本上在一个不可见的包装 div 中有三个彼此相邻的图像，在这里可以找到：http: //korilu.nl/maurits/search.html

我想要的是防止两个小的图像在单击时上下移动。
我试着按照上面提到的建议放在position:relative;包装纸和position:absolute; bottom:0;图像上，但是它们不再在中间，而是在左上角彼此重叠。我该怎么做呢？

编辑：或顶部或中心，我不在乎，只要他们停止移动

4

3 回答 3

2

You just need to alter your jQuery script:

$("a").click(function(){
                $(current).animate({
                    opacity: .5,
                    height: '100px', 'margin-top': '100px'
                });
                $("img", this).animate({height: '200px','margin-top': '0px', opacity: 1});
                current = "#" + $(this).find("img").attr("id");
            });

Note the two new occurences of margin-top. Tried it on your site and works as you want it.

于 2012-04-29T15:43:29.363 回答
1 
#icons
{
  text-align:center;
  height:20%;
  display: block;
  width: 405px;
  margin: 0 auto;
}
#icons a
{
  float: left;
}

摆脱您现在在其中一个链接上的边距/填充。我将宽度设置为 405px，因为您可能有一些样式会将其中一个推到下一行。

于 2012-04-29T15:39:03.673 回答
0

尝试使包装器 div 也相对，然后绝对属性将从包装器而不是整个文档中计数。

然后你可以通过设置 left:0; 来定位。底部：0；和权利：0；底部：0；用于左右图标。

于 2012-04-29T15:40:46.223 回答