Pular para o conteúdo principal

Efeito Glossy em imagem com javascript

Guia Blogger - Dicas, Tutoriais e Templates



Este script eu encontrei no site NETZGESTA, ele permite que você adicione cantos e sombreamento para imagens em suas páginas.

Ele funciona em todos os principais navegadores (Mozilla Firefox, Internet Explorer, Safari e Opera).
Demonstração:
Imagem sem o Script:
Guia Blogger - Dicas, Tutoriais e Templates*
Imagem com o script:
Guia Blogger - Dicas, Tutoriais e Templates*

Vamos começar a instalar.
Faça o download do arquivo Glossy.zip clicando AQUI.
Faça o upload dos arquivos Glossy.js e do arquivo cvi_glossy_lib.js no seu servidor de preferência. Eu recomendo o SkyDrive (Qualquer dúvida sobre como usar os scripts hospedados no SkyDrive, veja ESSE TUTORIAL do Dicas Blogger).
Depois, vá em Layout > Editar HTML , procure por </head> e cole esse código antes dela (Substituia os endereços em negrito pelo endereço dos arquivos que você hospedou a pouco):

<script type="text/javascript" src="http://SEUSERVIDOR.com/glossy.js"></script>
<script type="text/javascript" src="http://SEUSERVIDOR.com/cvi_glossy_lib.js"></script>

Clique em Salvar Modelo.
Para que suas imagens fiquem com o estilo Glossy, adicione o código class='glossy iradius50' no código da sua imagem. Exemplo:
Sem o efeito: <img src='http://imagem.jpg'/>
Com o efeito: < img src='http://imagem.jpg' class='glossy iradius50'/>.
*Créditos das imagens e do script: NETZGESTA por Christian Effenberger

Postagens mais visitadas deste blog

Mudar Imagem ao Passar o Mouse

A interatividade é o que muitas vezes (quando combinada com bom conteúdo) faz com que os leitores gostem e voltem a visitar o seu site. Nesse tutorial você aprende um código em JavaScript que altera a imagem quando o cursor do mouse passa sobre ela.

E-Referer - De onde vem seus visitantes?

O site E-Referer oferece uma ferramenta gratuita que mostra a origem dos visitantes do seu blog e a quantidade de visitas que lhe enviou.