hover effect with quicksand plugin

Question

I'm using Quicksand plugin on a website and I want to have all the items to have a hover effect. I managed to do it but the hover effect would disappear after the filtering occurs. I then followed this advice:

jQuery quicksand plugin with .click method

and added the following to my code:

$("img.on").live({
mouseover:
function() {
$(this).stop().animate({"opacity": "0"}, "slow");},
mouseout:
function() {
$(this).stop().animate({"opacity": "1"}, "slow");}});
$("img.over").live({
mouseover:
function() {
$(this).stop().animate({"opacity": "1"}, "slow");},
mouseout:
function() {
$(this).stop().animate({"opacity": "0"}, "slow");}});

It seems to work fine on ff but ie8 won't work. The hover image appears above the original one and doesn't move from there. If I change mouseover to mouseenter and mousout to mouseleave it will at least fade out after hovering and leaving and then perform as expected.

I have the opacity of the hover img to cero via css.

I might have made a newbie mistake, I'm completely new to js and jquery.

Answer 1

Using .live() I solved this so the clonned elements get affected by the hover