Puedes ver también este truco aplicado en mi página DIYs, así te doy otra idea de dónde puedes aplicar este truco !
Te explico el proceso, he subido mi foto clicando en el botón de la parte superior del post "inserta imagen", una vez hecho esto, me he ido a al pestaña "HTML" dónde he buscado y localizado el código de la foto en cuestión, en este caso sería :
<a href="http://4.bp.blogspot.com/-WTxN0LMFjLY/VPFf-8MFwcI/AAAAAAAAShA/RuZS9s9aFGI/s600/Efecto-opacidad-fotos.jpg" imageanchor="1" ><img border="0" src="http://4.bp.blogspot.com/-WTxN0LMFjLY/VPFf-8MFwcI/AAAAAAAAShA/RuZS9s9aFGI/s600/Efecto-opacidad-fotos.jpg" height="500" width="600" /></a>
¿ Por qué se que es ese el fragmento de código perteneciente a la foto ? muy sencillo, no hay más que fijarse en lo que viene a continuación de src ( que no es más que la url de la foto ), observarás que al final de dicha url viene el nombre que le hayas dado a la foto en cuestión.
Bien, una vez hecho esto no hay más que sustituir el fragmento de código HTML que ya hemos localizado por el siguiente :
<a href="http://4.bp.blogspot.com/-WTxN0LMFjLY/VPFf-8MFwcI/AAAAAAAAShA/RuZS9s9aFGI/s600/Efecto-opacidad-fotos.jpg" target="_blank"><img border="0" height="500" onmouseout="this.style.opacity=1;this.filters.alpha.opacity="70";" onmouseover="this.style.opacity=0.5;this.filters.alpha.opacity="50";" src=" http://4.bp.blogspot.com/-WTxN0LMFjLY/VPFf-8MFwcI/AAAAAAAAShA/RuZS9s9aFGI/s600/Efecto-opacidad-fotos.jpg" width="600" /></a>
Muy importante : si copias y pegar que no se te olvide sustitutir el href y el src por el href y el src de tu foto. Y por supuesto, el height (alto de la foto ) y width ( ancho de la foto ) sino es el deseado, del cual ya hablamos en este otro post.
Otra cosa, puedes modificar la intensidad de la opacidad, para ello deberás de modificar el valor que viene a continuación de this.style.opacity=, es decir el 0.5, teniendo en cuenta que cuanto más pequeño sea este valor más opaca se volverá la foto al pasar el ratón sobre ella, y lógicamente cuanto mayor sea éste valor al contrario, es decir menos opaca se volverá la foto al pasar el ratón sobre ella.
¿ Qué te ha parecido el truco de hoy ?, ¿ ya lo habías probado ?,...Quizá también te interese :
Consejos de blogger a blogger
Personalizar el tamaño de las fotos en blogger
Cómo mejorar la estructura de tus posts
Fuente: este post proviene de Café largo de ideas, donde puedes consultar el contenido original.
¿Vulnera este post tus derechos? Pincha aquí.
Creado: