Este es un genial efecto que se logra gracias a la libreria jQuery y algo de CSS,de seguro que os encantara el resultado final de este truco,no mas palabras y vamos a la accion.
Para agregar este efecto ve a a
Edición HTML del blog y marca la casilla
Expandir plantillas de artilugios, ahora pega antes
de </head> lo siguiente:
<script src='http://code.jquery.com/jquery-latest.js' type='text/javascript'/>
<link href=https://sites.google.com/site/miltrucosblogger/script/hojadoblada.css'' rel='stylesheet' type='text/css'/><script type='text/javascript'>$(document).ready(function(){
$("#blhojasquin").hover(function() {
$("#blhojasquin img , .blhojasquina ").stop()
.animate({width: '307px', height: '320px'}, 480);
} , function() {
$("#blhojasquin img").stop()
.animate({
width: '50px',
height: '52px'
}, 200);
$(".blhojasquina").stop()
.animate({width: '50px',height: '50px'}, 200);}); });</script>
<style>#blhojasquin .blhojasquina {background: url(URL IMAGEN) no-repeat right top;}</style><script src='http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js' type='text/javascript'/>
Reemplazas
URL IMAGEN por la imagen a mostrar cuando se pase el cursor por la esquina de la hoja (el blog).
Ahora encuentra la etiqueta
<body> y agrega el siguiente codigo
debajo:
<div id='blhojasquin'><a href='URL PAGINA'><img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqpnbAdUQLBIY9fGOKL-olN6fFdNFwT3iXs4b2Nga-UjAxXA1yGcK1UY5oGhmQ0BxwCoE6nTPGMbamTdxouJ2FBvhSGufqtJeJhltK8y57nldGd-QA4ZMOwXQn6O0MgFtO-FaxyqIpIx-Z/s320/blhojte.png'/></a><div class='blhojasquina'/></div>
Por ultimo guardas.
Puedes ver el truco en funcionamiento en el
siguiente blog de pruebas.