Uma melhor implementação de uma troca de imagem desvanecida com javascript / jQuery

Este é um problema ou erro específico, mas mais uma questão de implementaçã

Primeiro, eu gostaria de dizer que já passei por muitos tutoriais de imagens desbotadas e tenho um entendimento básico dos diferentes tipos. Espero que isso não seja descartado junto com outras centenas de perguntas sobre imagens desbotada

Este é basicamente o que eu gostaria: Uma imagem desvanecendo-se em outra imagem ao passar o mouse usando javascript e preferencialmente jQuery. Eu criaria duas imagens - uma chamada image.jpg e outra chamada image_o.jpg. Eles residiriam na mesma pasta.

Veja como seria a marcação html:

<img class="imghover" src="image.jpg" />

O javascript exigiria que eu tivesse oimghover class em todas as imagens que eu quero passar o mouse. O script detectaria a segunda imagem chamadaimghover_o.jpg e use-o para a segunda imagem na transição de desvanecimento instantâneo.

Não haveria CSS necessário oubackground-image para a transição.

Terei várias dessas imagens em uma grade e todas elas precisarão ter a transição do desbotamento.Então, você pode ver que não quero criar uma nova classe CSS para véspera, ry image ou ter scripts extras e marcação html que ficarão complicado

Todos os itens acima são alcançados com esteDaniel Nolan script menos a transição do desbotamento. O script apenas troca a imagem sem desbotamento, mas é configurado perfeitamente com o mínimo de códig

Então você poderia dizer que eu só quero adicionar uma transição de fade ao script de rolagem de Daniel Nolan. É possível refazer o script dele usando jQuery?

Isso é possível (com jQuery)?

O site em que vou usá-lo

questionAnswers(3)

yourAnswerToTheQuestion