javascript - Isotope.js 动态改变排序数据值

标签 javascript jquery jquery-isotope

我正在尝试动态更改 Isotope 项目的排序数据值,但 Isotope 似乎缓存了初始订单值,并且仅在 'reLayout' 调用中使用它。

我有一个项目页面,单击该项目将扩展到容器宽度的 100%。调整大小时,所有同位素项目都必须重新排序到特定位置。我遍历每个框并更新排序值。

以下示例显示了两个 Isotope 对象,顶部带有动画,可生成正确的排序顺序值,但定位错误,第二个带有应该的正确结果。

完整示例:http://jsfiddle.net/eB85m/4/

Isotope 是否有检索新排序数据或直接更新 Isotope 排序数据值的方法?

最佳答案

关于 Isotope 缓存初始订单值的说法是正确的 – 来自 Isotope 的文档 here :

The data cache is built on initialization so it can be quickly accessed when sorting.

同位素提供 updateSortData方法......好吧,初始化后更新排序数据。 Here's a working jsfiddle .

// Update sort data
// http://isotope.metafizzy.co/docs/methods.html#updatesortdata
$('#iso').isotope( 'updateSortData', $('#iso').children() );

对于您的原始示例并评论了“重新布局”——更新同位素的排序选项已经解决了这个问题(引用 Isotope 的 sorting demo)。

V2 Update:

In V2 you can use $('#iso').isotope('updateSortData').isotope();
(per comment below)

关于javascript - Isotope.js 动态改变排序数据值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15485843/

相关文章:

javascript - 如何为粘性标题设置动画?

javascript - Google Places API 自动完成功能返回的位置偏差

javascript - Jquery 返回值

php - 如何使用 CSS 和 PHP 根据纸张大小构建表格?

jquery - 按数据属性同位素排序

javascript - 同位素插件 : How to implement 'insertAfter" method?

javascript - 动画完成后如何完全删除/禁用同位素?

javascript - 动画将最后一个 child 附加到第一个

javascript - 隐藏中心的同时保留开始和结束的子字符串函数

javascript - 脚本在 IE 10 中无法正常工作