0

我一直在尝试让我的 Kickstarter.com 的顶栏看起来很酷的小图像炫耀 - 没有任何运气。

我试图绝对定位项目，但无论我做什么，它都不是“工作”。

以下是已完成的操作：

$('#holder .box').each(function(n){
   var pLeft = $(this).position().left;

   $(this).css({
     position: 'absolute',
     left: pLeft
   });
});

但随后所有项目都堆叠在一起。

顺便说一句：我知道这还不足以解决问题，但我需要帮助才能进一步解决这个问题。换句话说：我被困住了！

4

3 回答 3

1

我想你想要这样的东西：

http://fiddle.jshell.net/sfkzY/

不确定为什么要尝试使用 JS 进行布局？

于 2012-07-29T16:21:33.067 回答
1

当你看到一些很酷的东西时，你会想“他们是怎么做到的？” ...您的第一反应应该是什么？

在 Firebug 中查看它。或者 Chrome 的开发工具。或者其他的东西。看看 HTML 结构是什么。查看适用于所有内容的 CSS 是什么。如果有一个 CSS 规则你不明白它的作用，只是暂时关闭它或弄乱它的值。使用 Firebug 的能力来实时操纵内容对您有利。

在这种情况下，实际上并没有那么困难。里面的项目只是使用图像float:left; width:120px; height:90px——它们有很多。包装器为 2640 像素宽且居中，因此它是position:absolute; margin-left:50%; width:2640px; left:1320px.

于 2012-07-29T16:21:53.980 回答
0

这是一个网格，所以我会选择一张桌子，比如这个jsFiddle。

于 2012-07-29T16:35:09.760 回答