Pergunta

Eu tenho uma página com uma lista de elementos de exibição (itens) - que são desenhados de forma dinâmica, daí o vivo . Quando um usuário passa o mouse sobre um item, eu gostaria que eles para mudar para uma classe que é "on" e, em seguida, quando eles roll-off (mouseout) o item vai voltar ao normal. Os itens ligar com a linha de código abaixo, mas não desligue. Sugestões?

$('.item').live('mouseover', function(){$(this).switchClass('item','item_on', 500);});
$('.item_on').live('mouseout', function(){$(this).switchClass('item_on','item', 500);});

Obrigado!

Foi útil?

Solução

$('.item').live('mouseover',
function(){$(this).addClass('item_on');});
$('.item').live('mouseout',
function(){$(this).removeClass('item_on');});

Além disso, eu acho que para switchClass ao trabalho, você precisa incluir jQuery UI após jquery, mas antes de seu script, o que poderia estar acontecendo é o rato está indo para fora do elemento .item, antes do elemento .item_on é criado pelo atraso.

Além disso, eu acho que o que você está procurando, em vez de um switchclass atraso que pode não acionar o manipulador de eventos ao vivo, tente usar http://cherne.net/brian/resources/jquery.hoverIntent.html em vez disso, com o acima addClass / removeClass.

Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top