CHAT DESLIZANTE HACIA ABAJO
<style type="text/css"> /*<![CDATA[*/ <!-- #louver { z-index:10005; width:430px; height:310px; position:fixed; right: 10px; top: -310px; overflow: visible; background-repeat: no-repeat; background-image: url(http://u.jimdo.com/www17/o/s224fc11c65cbc592/img/i3cd47a4ebdccfd4e/1348442120/std/bg-chat-1.png); visibility: visible; } #louver #c_d { right: 5px; position: absolute; top: -36px; z-index: 10003; } #louver #c_i { position: absolute; left: 5px; top: -36px; z-index: 10003; } #louver #notoy{ width:408px; height:286px; overflow:hidden; margin-top: 10px; margin-right: auto; margin-left: auto; border: 1px solid #000000; } #image_chat{ position:absolute; bottom: -33px; height: 40px; width: 200px; right: 110px; background-repeat: no-repeat; background-image: url(http://u.jimdo.com/www17/o/s224fc11c65cbc592/img/ifecb381956d8495e/1348442039/std/bg-image-chat.png); visibility: visible; } /*Diseño: Abraham de la C.*/ --> /*]]>*/ </style>
AHORA COPIAS EL SIDEBAR
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"> </script><script type="text/javascript"> //<![CDATA[ var e = jQuery.noConflict(); e(document).ready(function(){ e("#louver").hover(function(){ e(this).stop(true,false).animate({top: 33}, 700); },function(){ e("#louver").stop(true,false).animate({top: -310}, 1700); }); }); //]]> </script> <div id="louver"> <img id="c_i" src="http://u.jimdo.com/www17/o/s224fc11c65cbc592/img/id81f223d07ed3030/1348441924/std/cadena-1.png" _fcksavedurl="http://u.jimdo.com/www17/o/s224fc11c65cbc592/img/id81f223d07ed3030/1348441924/std/cadena-1.png" /> <img id="c_d" src="http://u.jimdo.com/www17/o/s224fc11c65cbc592/img/id81f223d07ed3030/1348441924/std/cadena-1.png" _fcksavedurl="http://u.jimdo.com/www17/o/s224fc11c65cbc592/img/id81f223d07ed3030/1348441924/std/cadena-1.png" /> <div id="notoy"> <div id="image_chat"> </div> <embed wmode="transparent" src= "http://www.xatech.com/web_gear/chat/chat.swf" quality="high" width="408" height="286" name="chat" flashvars="id=191691203&rl=Spanish" align="middle" allowscriptaccess="sameDomain" type= "application/x-shockwave-flash" pluginspage="http://xat.com/update_flash.shtml" ></embed> </div> </div>
FACEBOOK DESLIZANTE
<div class="slide_likebox"> <div style="color: rgb(255, 255, 255); padding: 8px 5px 0pt 50px;"><span> <div class="likeboxwrap"><iframe src="http://www.facebook.com/plugins/likebox.php?href=http://www.facebook.com/comediantebaratosinimpuestos?ref=hl&width=238&colorscheme=light&connections=15&stream=false&header=false&height=350" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:228px; height:320px;" allowtransparency="true"></iframe></div> </span></div> </div> <style type="text/css"> .slide_likebox { float:right; width:288px; height:345px; background: url(https://lh6.googleusercontent.com/-VW_GzzYnZJ0/TkiZQFcBc2I/AAAAAAAABmg/fa9_qWV8Cu4/fb_bg.png) no-repeat !important; display:block; right:-250px; padding:0; position:fixed; top: 130px; z-index:1002; border-radius:10px; -moz-border-radius:10px; -webkit-border-radius:10px; } div.likeboxwrap { margin-top:2px; margin-left:-5px; width:238px; height:325px; background-color:#fff; overflow:hidden; border-radius:10px; -moz-border-radius:10px; -webkit-border-radius:10px; } div.likeboxwrap iframe {margin:-1px} </style> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script> <script type="text/javascript"> jQuery.noConflict(); jQuery(function (){ jQuery(".slide_likebox").hover(function(){ jQuery(".slide_likebox").stop(true, false).animate({right:"0"},"medium"); },function(){ jQuery(".slide_likebox").stop(true, false).animate({right:"-250"},"medium"); },500); return false; }); </script>
