问题标签 [jquery-isotope]

我最近发现了Masonry和Isotope JQuery 插件。它们似乎在功能上几乎相同，并且似乎都具有相同的作者。我能看到的唯一明显区别是许可证。

就功能而言，这两者之间的主要区别是什么？你为什么要使用一个而不是另一个？

如果您进入此页面，您可以搜索要订阅的艺术家，然后通过单击“订阅”在搜索结果中订阅艺术家。

如果您订阅了一位艺术家，然后尝试取消订阅，该艺术家不会从列表中删除，但您第二次单击取消订阅按钮时，他们会被删除。

订阅艺术家的列表存储在由全局变量引用的同位素容器中SF.container。

当用户通过调用订阅时，将艺术家添加到容器中

通过调用从容器中删除艺术家

每次单击“取消订阅”时都会将相同的参数值传递给该函数，所以我不知道为什么它第二次起作用，但不是第一次。

仅当您订阅艺术家然后尝试取消订阅而不刷新页面时才会出现此问题，即在页面首次加载时取消订阅页面中的艺术家没有问题。上面引用的函数在global.js.

我对 jQuery 有点陌生，但我确实了解事情是如何工作的。现在我正在使用 Isotope（流体/响应式布局）开发一个简单的页面，并成功地将Fancybox集成到其中的内容中。但问题是，每当我尝试在 Isotope 中的一个框中单击图像链接时，假设每次单击后该框都会放大，该框将关闭回其原始大小，图像覆盖在顶部整个东西。

我真的不知道如何解释它，但这是我在 jsfiddle 创建的网站示例：

1）不知何故，我设法让盒子按我想要的方式工作，所以盒子选择不是问题。但是如何单击展开框的文本/视频链接而不使框关闭回其原始大小和位置？我只希望它在我单击另一个新框时关闭。

2）而且，如果可能的话，每次单击时窗口是否可以滚动到选定的框？

我希望这不会让任何人感到困惑。提前谢谢了！:)

我已经尝试过 jQuery Masonry和Isotope插件，但似乎无法实现我想要的布局。

两个插件似乎都根据前一行元素的高度计算“下一个可用空间”。例如：

在此示例中，#6 项位于最右侧，因为 #4 的高度小于 #2 的高度（我希望它到达的位置）。

我想实现的布局更类似于左浮动元素：

上述两个插件是否有实现此布局的选项，或者可能有不同的插件可用？

我正在尝试用同位素过滤项目。这些项目位于不同的 div 中，但由于某种原因，过滤器仅适用于第一个 div。这是我的代码：

我的JavaScript：

我究竟做错了什么？

提前致谢

毛罗

我正在尝试创建一个带有排序、布局按钮和多个过滤器的页面。同位素主页就是一个很好的例子，但那里只有一个过滤器。使用该页面，我无法弄清楚如何添加更多可以协同工作的过滤器（即颜色和大小，协同工作，而不是一次一个）。下面是代码...如何添加另一个过滤器？

这是javascript：

我开始在我的项目中使用很棒的 JQuery Isotope 插件。一切都很好，但我遇到了corner-stapm选项的一个问题。

我的 masnory 网格中的每个元素都有固定宽度（220px + 5 边距）和随机高度（取决于其内容），我在 CSS 文件中使用@media 查询来更改不同屏幕分辨率上的列数（页面宽度可以是 230、460 , 690.. 等）。

角落印章的问题出现在最窄的版本（一列）中 - 角落印章被同位素元素覆盖......

在这个演示中，同位素官方页面上也出现了同样的问题：http: //isotope.metafizzy.co/custom-layout-modes/masonry-corner-stamp.html（当窗口变窄时，大红色矩形隐藏在其他同位素元素后面） .

我发现它可以像在 Masnory 插件演示站点中一样正常工作！ http://masonry.desandro.com/demos/corner-stamp.html

我已经结合将站点脚本从 Masnory 复制到 Isotope，但没有运气，因为我不太擅长 JS/jQuery：/

让它在 Isotope 中工作会很棒，因为我希望我的网站有过滤选项（在 Masnory 插件中不可用）。

我计划使用伟大的同位素插件来显示联系人列表，然后允许它们被过滤。我遇到的问题是它适用于小型数据集，但我不确定将其扩展到 1000 多条数据的最佳方法。

到目前为止，我的想法是：

• 加载一个随机子集，然后在单击过滤器时向其添加节点以填补空白
• 在用户滚动时加载更多节点
• 分页结果
• 在选择足够的过滤器以使数字低于预定义的阈值之前，不显示联系人。

我不确定这些是否能正常工作，我希望其他人也遇到过这种情况并能给我一些想法。

我正在使用同位素，这是 jsfiddle：http: //jsfiddle.net/desandro/DA3wF/

或者，或者，我设置了一个演示：http: //nerdi.net/isotope-test.html

有一个选项filter: selector

我怎么能通过一个过滤器，例如：index.html#green在页面加载时，会过滤到.green类？这可能吗？

如果您使用 CSS3 动画在屏幕上定位相对位置的元素

当您使用 javascript 询问项目位置时，它会报告该项目仍在

例如，看看这个使用 jQuery Isotope 插件的例子中元素的位置：

http://isotope.metafizzy.co/demos/basic.html

我必须像这样使用 jQuery css() 方法吗？我什至不知道这是否会奏效！

更新：

我在 JsFiddle http://jsfiddle.net/uQtur/3/上发布了一个示例

JS

HTML