Tutorial- Leia Mais muda de imagem ao passar o mouse

GigaTítulo ^
SEPHOHRA | via TumblrImagem Perfeita omg u.u
Heyy Guys
Trouxe um tuto super 10 :3
O "Leia Mais" vem em um link bem caído!
E se ele fosse bem fofo,e mudasse de imagem ao passar o mouse *w*
Achei esse tuto perfeito ^^ aqui --> (www) 
Bom vamos lah!



Vá no seu HTML e marque a opção ''expandir modelos de widgets'' dê um ctrl + f e procure por: <data:post.jumpText/> apague e no lugar cole o seguinte código:
<img border='0' onmouseout='this.src=&apos;url da imagem principal&apos;' onmouseover='this.src=&apos;url da imagem com o mouse em cima&apos;; return true' src='url da imagem principal'/>
Entenda o código! Nos trechos url da imagem principal apague e cole a url da imagem que irá aparecer sem o mouse estar em cima, exemplo:


No trecho url da imagem com o mouse em cima apague e cole a url da imagem que irá aparecer com o mouse em cima, exemplo:
Vocês mesmos podem criar suas imagens e hospede as em um site que faça isso gratuitamente ex:imgur.com 
Carol como eu pego a URL de uma imagem? 
clique em cima da imagem com o botão direito do mouse e selecione '' copiar url da imagem ''. Só isso.

 Bom pra quem está com preguiça de fazer isso tudo eu já deixei alguns códigos prontos para>> Estou deixando vocês mal acostumados hein, kkkkkk'

Cole o código abaixo no ''lugar'' de: <data:post.jumpText/>
GENTEEE --> Deu erro entao se vc passar o mouse agora aqui não vai mudar,mais pode por o código que vai dar ;3


<img border='0' onmouseout='this.src=&apos;http://i.imgur.com/uErwS.png&apos;' onmouseover='this.src=&apos;http://i.imgur.com/8G7q6.png&apos;; return true' src='http://i.imgur.com/uErwS.png'/>




<img border='0' onmouseout='this.src=&apos;http://i.imgur.com/eo1m2.png&apos;' onmouseover='this.src=&apos;http://i.imgur.com/eTYhs.png&apos;; return true' src='http://i.imgur.com/eo1m2.png'/>




<img border='0' onmouseout='this.src=&apos;http://i.imgur.com/eWFP8.png&apos;' onmouseover='this.src=&apos;http://i.imgur.com/FHNfD.png&apos;; return true' src='http://i.imgur.com/eWFP8.png'/>




<img border='0' onmouseout='this.src=&apos;http://i.imgur.com/oQTJO.png&apos;' onmouseover='this.src=&apos;http://i.imgur.com/DEsev.gif&apos;; return true' src='http://i.imgur.com/oQTJO.png'/>




<img border='0' onmouseout='this.src=&apos;http://i.imgur.com/v9zVo.png&apos;' onmouseover='this.src=&apos;http://i.imgur.com/PScl7.png&apos;; return true' src='http://i.imgur.com/v9zVo.png'/>

É isso espero que tenham gostado!



2 Pipocas Estouraram!:

  1. Adoreii
    Super legal esse tutorial
    Bem útil
    Blog lindo o seu hein Linda???
    Beijinho

    ResponderExcluir
  2. Amei
    o tutorial super bem feitinho
    e vc é demais em carol?Admiro mto seu trabalho aqui!Coloca os creditos td direitinho....Parabens!

    ResponderExcluir

Algumas Regrinhas *-*:
1-Comentários só com; "Seguindo Retribui?" Serão ignorados!.
2-Não aceito Tags/Selinhos.
3-Deixe o Link do seu Blog pra eu visitar se você quiser!.

Comentar faz bem a saúde da Carol!! :)