Para poner este efecto de página doblada en el blog entra en la Edición de HTML y antes de</head> pega el script:
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js' type='text/javascript'/>
<script>
//<![CDATA[
$(document).ready(function(){
$("#pageflip").hover(function() {
$("#pageflip img , .msg_block").stop()
.animate({
width: '307px',
height: '319px'
}, 500);
} , function() {
$("#pageflip img").stop()
.animate({
width: '50px',
height: '52px'
}, 220);
$(".msg_block").stop()
.animate({
width: '50px',
height: '50px'
}, 200);
});
});
//]]>
</script>
Luego antes de ]]></b:skin> pega los estilos:
/* Página doblada
----------------------------------------------- */
#pageflip {
position: relative;
right: 0;
top: 0px; /* Cambiar a 30px si tienes la navbar (barra de navegación) */
float: right;
z-index:9;
}
#pageflip img {
width: 50px;
height: 52px;
z-index: 99;
position: absolute;
right: 0;
top: 0;
-ms-interpolation-mode: bicubic;
}
#pageflip .msg_block {
width: 50px;
height: 50px;
overflow: hidden;
position: absolute;
right: 0;
top: 0;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvYFg43JXAZhO5uKzTst6izN2_jmR9Sn5it3dWYNtyD7i3e2G8ZK89D-Bjqu-_m5X-VAPRxTTOmA_xv_Mqp7jvIffH8b9-gM3EolIKuVWfd8Jk3nw-YABtBpA5WqAtGmAsLACLL6B1jS4/s0/pagina-detras.png) no-repeat right top;
}
#pageflipMirror {
position: static;
right: 0;
top: 0;
float: right;
}
Por último pega después de <body> o de:
<body expr:class='"loading" + data:blog.mobileClass'>Lo siguiente:
<div id='pageflip'>
<a href='http://nombre-de-mi-blog.blogspot.com/atom.xml'>
<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTptvs9_qef5anB0ekA9XEXYsNISqyGZiVotLqV_cbpIohSqoLTRRkkKBK7QooO4B7nGTZbL-TZZ4_HoaxA64Vrq-cSXMlrY9K_Ddlpnvk0q94Hgw5onwTlcdQHCo9He0vagFAuIBBX90/s0/pagina-doblada.png' style='width: 50px; height: 52px; overflow-x: hidden; overflow-y: hidden;'/></a>
<div class='msg_block' style='width: 50px; height: 50px; overflow-x: hidden; overflow-y: hidden; '/>
</div>
No hay comentarios:
Publicar un comentario