Question

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

我设置了这样，当你悬停它们时，项目的背景会变成红色，但奇怪的是，Isotope会在经过一些过滤后删除某些中的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() );
});

$("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

感谢大卫指出......

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

2 个答案: