jquery - 同位素脚本删除了一些 CSS 规则？

Question

我正在开发一个网站并使用非常好的同位素脚本来创建一个带有项目的可过滤区域。

我已经设置，当你将它们悬停时，项目的背景会变成红色，但奇怪的是，同位素在一些过滤后会删除其中一些效果hover。

您可以在这里看到我的意思的示例：http: //paragraphe.org/henpier/isotope_test/archive.html

尝试将它们悬停：一切似乎都很好。然后尝试过滤它们几次，突然有些hover效果停止工作......

请问各位大神，能帮我解答一下为什么会这样吗？非常感谢，

Answer 1

同位素会在脚本中引起冒泡 - 参考您的悬停效果，使用 ON 将它们绑定。http://api.jquery.com/on/

$("p").on("hover", function(){
alert( $(this).text() );
});

虽然 - 我看到你是通过 css 设置它。- 您可以循环遍历同位素元素并专门附加该类以确保其正常工作。或者您可以使用上面的悬停功能来附加或删除类。

http://isotope.metafizzy.co/docs/extending-isotope.html

$('#container').isotope({
  itemSelector: '.element',
  itemPositionDataEnabled: true
})
// log position of each item
.find('.element').each(function(){
  var position = $(this).data('isotope-item-position');

//APPEND required class here. ensure its on the elements

  console.log('item position is x: ' + position.x + ', y: ' + position.y  );
});

Answer 2

我完全错过了 Isotope 需要的重要 CSS 规则，特别z-index是过滤部分的一些规则：

http://isotope.metafizzy.co/docs/introduction.html#css

感谢大卫指出这一点......