Etiquetas: Blogger, Cosas cayendo por el blog, Lluvia, Tutoriales

Diseño.

Añadir un gadget

HTML/Javascript

Y copiamos el siguiente código:

 <style>     /* ----- Image opacity effect 2 ----- */     .post a img {     filter:alpha(opacity=50);     -moz-opacity: 0.5;     opacity: 0.5;     -khtml-opacity: 0.5;     }
    .post a:hover img {     filter:alpha(opacity=100);     -moz-opacity: 1.0;     opacity: 1.0;     -khtml-opacity: 1.0;     }     </style>

Etiquetas: Blogger, Image Hover, Opacidad, Tutoriales

.header .widget { text-align:center;}.header img {margin:0 auto;}

Etiquetas: Blogger, Tutoriales

<center><style type="text/css">#at{position:fixed;right:250px;z-index:+1000;}* html #at{position:relative;}.attab{height:100px;width:30px;float:left;cursor:pointer;background:url();}.atcontent{float:left;border:none;background: repeat-x bottom center scroll ;-moz-border-radius:20px;padding:10px;}</style><script type="text/javascript">function showHideAT(){var at = document.getElementById("at");var w = at.offsetWidth;at.opened ? moveAT(0, -200-w) : moveAT(20-w, 0);at.opened = !at.opened;}function moveAT(x0, xf){var at = document.getElementById("at");var dx = Math.abs(x0-xf) > 25 ? 35 : 1;var dir = xf>x0 ? 1 : -1;var x = x0 + dx * dir;at.style.top = x.toString() + "px";if(x0!=xf){setTimeout("moveAT("+x+", "+xf+")", 10);}}</script><div id="at"><div class="attab" onclick="showHideAT()"> </div><div class="atcontent"><div align="center"><div style="background:url() no-repeat;"><div style="text-align: center;"><div class="separator" style="clear: both; text-align: center;"><br /><form name="news"><textarea rows="1" style="border:3px double #E3CEF6;-moz-box-shadow: 0 0 15px 5px #E3CEF6;-webkit-box-shadow: 0 0 15px 5px #E3CEF6;border-radius:7px;font-size:12px;font-family:century gothic;cursor:crosshair;" cols="30" name="news2" wrap="virtual"></textarea><script language="JavaScript">var newsText = new Array();newsText[0] = "TEXTO";newsText[1] = "TEXTO";newsText[2] = "TEXTO";newsText[3] = "TEXTO";newsText[4] = "TEXTO";newsText[5] = "TEXTO";newsText[6] = "TEXTO";newsText[7] = "TEXTO";
var ttloop = 1; //var tspeed = 70; //var tdelay = 1000; //// ------------- CANNOT EDITING ------------- \var dwAText, cnews=0, eline=0, cchar=0, mxText;function doNews() {mxText = newsText.length - 1;dwAText = newsText[cnews];setTimeout("addChar()",1000)}function addNews() {cnews += 1;if (cnews <= mxText) {dwAText = newsText[cnews];if (dwAText.length != 0) {document.news.news2.value = "";eline = 0;setTimeout("addChar()",tspeed)}}}function addChar() {if (eline!=1) {if (cchar != dwAText.length) {nmttxt = ""; for (var k=0; k<=cchar;k++) nmttxt += dwAText.charAt(k);document.news.news2.value = nmttxt;cchar += 1;if (cchar != dwAText.length) document.news.news2.value += "_";} else {cchar = 0;eline = 1;}if (mxText==cnews && eline!=0 && ttloop!=0) {cnews = 0; setTimeout("addNews()",tdelay);} else setTimeout("addChar()",tspeed);} else {setTimeout("addNews()",tdelay)}}doNews()</script></form></div>Código de tu Cbox</div></div><br /><div align="right"><a href="javascript:void(0);" onclick="showHideAT()"><div ><span ></span></div></a></div></div></div><script type="text/javascript">var at = document.getElementById("at");at.style.top = (-200-at.offsetWidth).toString() + "px";</script><a href="javascript:void(0);"onclick="showHideAT()"/><img class="expando" src="URL de la imagen de cbox" alt="PUSH" title="Click"style='position:fixed; top:0; right:50px;'/></a></div></center>

 <style type="text/css">#gb{position:fixed;top:50px;z-index:+1000;}* html #gb{position:relative;}.gbtab{height:400px;width:150px;float:left;cursor:pointer;background:url('URL DE LA IMAGEN QUE DICE CBOX') no-repeat;}.gbcontent{float:left;border:1px solid #F6CEF5;background:#F5F5F5;padding:8px;}</style><script type="text/javascript">function showHideGB(){var gb = document.getElementById("gb");var w = gb.offsetWidth;gb.opened ? moveGB(0, 150-w) : moveGB(170-w, 0);gb.opened = !gb.opened;}function moveGB(x0, xf){var gb = document.getElementById("gb");var dx = Math.abs(x0-xf) > 10 ? 5 : 1;var dir = xf>x0 ? 1 : -1;var x = x0 + dx * dir;gb.style.right = x.toString() + "px";if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}}</script><div id="gb"><div class="gbtab" onclick="showHideGB()"> </div><div class="gbcontent">CÓDIGO DE TU CBOX<div style="text-align:right"><a href="javascript:showHideGB()">[close]</a></div></div></div><script type="text/javascript">var gb = document.getElementById("gb");gb.style.right = (140-gb.offsetWidth).toString() + "px";</script>

Iconos de Cbox (si los usas dame créditos, son todos míos):

Etiquetas: Blogger, CBox, Recursos, Tutoriales

<data:post.jumpText/>

Reemplazas ese código por el siguiente:

<img src="URL de la imagen"/>

Etiquetas: Blogger, Tutoriales