问题标签 [jquery-isotope]

我一直在与同位素斗争一段时间。经过几次不同的坐姿，我似乎无法弄清楚这一点。

isotope.metafizzy.co/index.html

我将用图像说明我的问题，但这里是解释。正如你在我的网站上看到的，

test.davewhitley.com/not-wp/isotope_test/index.php

我正在使用具有三个相同宽度列的同位素。

如果您查看中心布局的外边缘，您会发现有一些填充，迫使整个中心比页眉/页脚窄一些。我已经尽情地使用 CSS，但我不知道如何将中央画廊扩展到包含它的 div 的边缘（它是 960 像素 - 因此，中央画廊大约是 940 像素）。通常我可以只用 div 和一些 CSS 来做到这一点，但是 masonry 的 javascript 在我头上（所有它的计算等等）。任何帮助将不胜感激。

这是我的问题说明。是）我有的：

http://farm7.static.flickr.com/6207/6057816365_e0b6e2e8c4.jpg

我想要什么：

http://farm7.static.flickr.com/6208/6058362460_d1200a1491.jpg

抱歉链接的图片和非超链接的文字，我在这个网站上太年轻了。

是否可以强制打开的 jQuery Isotope div 在所有其他 div 之上打开，迫使它们向下 - 所以即使底部有一个框，一旦点击它也会跳到顶部？

目前它看起来很随机 - 一些跳下一条线，一些向右移动，等等。我想做的是一旦点击一个 div，它就会跳到左上角并接管整条线，而其他未点击的 div 都跳到下面的行。

jsFiddle链接是http://jsfiddle.net/djsbaker/gPuD9/

我正在使用 Isotope JS 排序和排列图像，除了页面加载时脚本在加载所有图像之前不会运行，它工作正常。在 Isotope JS 帮助页面上，它声明提供高和宽值将为脚本提供在不加载图像的情况下排列项目所需的信息。我这样做了，但脚本仍然只在所有图像加载后才被触发。我是 JS 编码的新手，所以我试图找到我错过的东西。

$(window).load(function(){ $('#container').isotope({ itemSelector : '.item' }); }); var $container = $('#container'); $('.filters a').click(function(){ var selector = $(this).attr('data-filter'); $container.isotope({ filter: selector }); return false; }); $('#options').find('.option-set a').click(function(){ var $this = $(this); // 如果已经选择则不要继续 if ( !$this.hasClass ('selected') ) { $this.parents('.option-set').find('.selected').removeClass('selected'); $this.addClass('selected' ); } });

在 David DeSandro 的有趣 Isotope 实现列表中，这里有一个http://www.wonderfulwebsolutions.net/会在单击元素后显示其他内容（图像、文本、链接等）。虽然作为 jQuery 的新手，我似乎已经了解了这个出色插件的非常基本的基础知识 - 在这里进行简单测试http://www.16percent.de/siehmaleineran.html我不明白如何在每个放大的元素中显示内容，一旦它被点击。我不追求更棘手的东西，因为在该示例的元素中运行的自动幻灯片；类别过滤和排序现在也根本不重要。

有谁知道这应该如何以正确的方式完成？从另一篇文章中我了解到，首先每个元素必须被放大，以便 Isotope 在其他情况发生之前制定布局。

非常感谢您提前提供任何见解。

我正在做一个砖石风格的页面，其中的框在单击时会展开。我已经制作了 javascript 代码，以便在单击另一个框时所有其他框将默认为其原始大小；即：一次只能扩展一个框。

它工作正常！

问题是同位素不会为盒子的大小调整设置动画，只有重新定位！

所以我调用了 jquery UI 插件来动画那个切换类函数，这样不仅元素的重新定位将被动画化，而且元素本身的扩展也会被动画化。

但是唉，jquery UI 和 isotope 中的某些东西并不完全吻合，这意味着元素的重新定位会以某种方式搞砸。

示例的 javascript 代码是这样的：

第一个有效的：

然后一个不起作用（注意毫秒是两个示例之间的唯一区别）：

有谁知道问题是什么，或者如何解决？提前非常感谢大家。

//一个。

我正在使用带有哈希历史的同位素。它工作得很好，但我对 URL 不满意 - 我想简化和清理它。

目前使用：

在这个标记上：

所以，我的问题是：我怎样才能使它与以下标记一起工作？

我只使用过滤器，所有其他同位素选项都被锁定，所以我希望删除对过滤器的引用。

提前致谢！

我目前正在玩 jQuery Isotope。我喜欢它，但它远远超出了我非常非常基本的 jQuery 知识。到目前为止，在其他人的帮助下，我正在慢慢达到我的最终目标。我今天的问题是看看是否有可能在打开的大框关闭之前使小框不可点击 - 请参阅http://jsfiddle.net/djsbaker/gPuD9/

我的理想是让每个较小的盒子在最顶部打开，然后将所有较小的盒子向下推。这看起来不太可能，因为在用户单击多个框后，较大的框会下降到第二行。解决此问题的一种方法是，一旦打开较大的框，就不要使较小的框不可点击……至少我希望如此。

提前致谢。

D B

是否有任何其他 jQuery Isotope 插件实现者知道，是否可以在单击新的 .element 时自动缩小当前放大的 .element，以及是否可以让当前放大的 .element 始终显示在 #容器 div （其他元素可以在重新布局后像往常一样使用同位素）？

谢谢！

我正在使用 jQuery Isotope 过滤产品照片。我不得不更改示例以使用选择框，效果很好，但现在我需要调整示例中的代码，该示例具有多个过滤属性。

这是有效的示例代码：

这是我的代码不起作用。

我已将其追踪到要添加的 isoFilters 数组项，但它们是空的。我无法弄清楚问题是什么。

如果我替换此行，则代码有效：

有了这个：

但这不允许过滤两组，只有一个。

我对此有点头绪，希望能得到一些帮助。

谢谢。

我正在一个简单的网站上使用 Twitter 的 Bootstrap css 框架作为基本样式（不知道这是否是相关信息）。

我使用 isotope.js 制作了一个简单的可过滤产品页面，它在我的 Mac 上的 Chrome、Safari 和 Firefox 中按预期工作。然而，在 IE8 和 IE9 中发生了一些奇怪的事情；图像都被弄皱了（它们应该是方形的，使用 WP 特色图像功能），请参阅图像。

该网站的网址是：http ://www.nieuwkerkonline.nl/het-bedrijf/producten/

有谁知道是什么原因造成的，我该如何解决？圆角和其他 CSS3 优点被忽略的事实，我可以接受，但图片肯定需要正确显示。

任何帮助将不胜感激。