Script  caja flotante lateral derecho y desplegable de Chatango para Blogger. Script caja flotante lateral derecho y desplegable de Chatango para Blogger.
Página 1 de 2 12 ÚltimoÚltimo
Mostrando resultados del 1 al 10 de 17
  1. #1
    Registro
    28-noviembre-2012
    Ubicación
    Peru
    Edad
    37
    Mensajes
    832
    Script caja flotante lateral derecho y desplegable de Chatango para Blogger.



    Código:
    <style>
    #hcr {
    position:fixed;
    top:60px;
    z-index:+1000;
    }
    * html #hcr {position:relative;}
    .hcrtab {
    height:100px;
    width:30px;
    float:left;
    cursor:pointer;
    background:url('http://2.bp.blogspot.com/-n6MFSSLcJ4w/T01qsipf6YI/AAAAAAAAGwM/dkqmUuQV4ZQ/s1600/ChatBox5.png') no-repeat;
    }
    .hcrcontent {
    float:left;
    border:2px solid #FF2E2E;
    background:#FFD0D0;
    padding:10px;
    }
    .hc-credit {font-size:9px}
    .hc-credit a {text-decoration:none}
    </style>
    <script type="text/javascript">
    function showHidehcr(){
    var hcr = document.getElementById("hcr");
    var w = hcr.offsetWidth;
    hcr.opened ? movehcr(0, 30-w) : movehcr(20-w, 0);
    hcr.opened = !hcr.opened;
    }
    function movehcr(x0, xf){
    var hcr = document.getElementById("hcr");
    var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
    var dir = xf>x0 ? 1 : -1;
    var x = x0 + dx * dir;
    hcr.style.right = x.toString() + "px";
    if(x0!=xf){setTimeout("movehcr("+x+", "+xf+")", 10);}
    }
    </script>
    <div id="hcr">
    <div class="hcrtab" onclick="showHidehcr()"> </div>
    <div class="hcrcontent">
    
    <!-- CHAT BOX CODE HERE -->
    <object width="250" height="350" id="obj_1330475176845"><param name="movie" value="http://BloggeameBblggr.chatango.com/group"/><param name="AllowScriptAccess" value="always"/><param name="AllowNetworking" value="all"/><param name="AllowFullScreen" value="true"/><param name="flashvars" value="cid=1330475176845&a=FF2D2D&b=100&c=FFFFFF&d=FFFFFF&k=FF2D2D&l=999999&s=1&w=0"/><embed id="emb_1330475176845" src="http://BloggeameBblggr.chatango.com/group" width="250" height="350" allowscriptaccess="always" allownetworking="all" type="application/x-shockwave-flash" allowfullscreen="true" flashvars="cid=1330475176845&a=FF2D2D&b=100&c=FFFFFF&d=FFFFFF&k=FF2D2D&l=999999&s=1&w=0"></embed></object><br />[ <a href="http://BloggeameBblggr.chatango.com/clonegroup?ts=1330475176845">Copy this</a> | <a href="http://chatango.com/creategroup?ts=1330475176845">Start New</a> | <a href="http://BloggeameBblggr.chatango.com">Full Size</a> ]
    <!-- END CHAT BOX CODE --->
    
    
    <br />
    <div class="hc-credit">
    <span style="float:left">
    <a href="http://bloggeameblogger.blogspot.com/2012/02/caja-de-chat-en-forma-flotante-para-tu.html" target="_blank">
    [?]
    </a>
    </span>
    <span style="float:right">
    <a href="javascript:showHidehcr()">
    [Cerrar]
    </a>
    </span>
    </div>
    </div>
    </div>
    <script type="text/javascript">
    var hcr = document.getElementById("hcr");
    hcr.style.right = (30-hcr.offsetWidth).toString() + "px";
    </script>
    </div>
    <div class='clear'></div>
    <span class='widget-item-control'>
    <span class='item-control blog-admin'>
    <a class='quickedit' href='//www.blogger.com/rearrange?blogID=6756021128688737735&widgetType=HTML&widgetId=HTML7&action=editWidget&sectionId=sidebar' onclick='return _WidgetManager._PopupConfig(document.getElementById("HTML7"));' target='configHTML7' title='Editar'>
    
    </a>
    </span>
    </span>
    <div class='clear'></div>
    </div></div>
    </div>
    <div class='clear'></div>
    </div>
    <div class='clear'></div>
    </div>

    pueden provarlo aqui que funciona correctamente.

    Probar código HTML. Herramientas webmaster :: LaWebera.es

  2. #2
    Registro
    06-abril-2009
    Ubicación
    Mexicali, Mexico
    Edad
    31
    Mensajes
    12.737
    Tutorial aprobado y agregado al listado, gracias por el aporte.

  3. #3
    ¡Muchas gracias! esto me será de mucha ayuda

    - No me convenció mucho pero me dio una idea
    Última edición por DanyL; 23-mar-2013 a las 16:44

  4. #4
    Muchísimas gracias.

  5. #5
    Registro
    03-marzo-2013
    Ubicación
    México, Tijiuana
    Edad
    24
    Mensajes
    1.113
    Gracias por el aporte man aunque una vez implementado creo que se laggea la web ¿no?
    Por cierto, interesantes las conversaciones en el chat jaja Cx

  6. #6
    Registro
    04-marzo-2012
    Ubicación
    Venezuela
    Edad
    21
    Mensajes
    293
    Muchas gracias

  7. #7
    alguien me puede ayudar para que sea al otro lado?

  8. #8
    Cita Iniciado por dany_danay Ver Mensaje
    alguien me puede ayudar para que sea al otro lado?
    Cambia esto:
    float:left;

    Por esto:
    float:right;

  9. #9
    Registro
    04-abril-2013
    Ubicación
    Bogotá D.C.
    Edad
    23
    Mensajes
    14
    Excelente ya lo tenia y funciona mejor que Xat.com...

  10. #10
    Registro
    06-agosto-2014
    Ubicación
    Peru
    Mensajes
    283
    Gracias, agregado a favoritos.

Página 1 de 2 12 ÚltimoÚltimo

Temas similares

  1. Tutorial: Mini toolbar flotante fijo redes sociales para Blogger
    Hola a todos hoy tengo un mini script lo compartire es simple, fácil de implementar en su blogger, como también en su pagina web, sea Wordspress,...
    Respuestas: 1
    Último mensaje: 08-abr-2013
  2. Caja flotante lateral derecho desplegable de chatango te explico.
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html dir='ltr'...
    Respuestas: 1
    Último mensaje: 24-mar-2013
  3. ¿plugins Caja De Comentarios facebook "en modo caja flotante lateral "es posible?
    ¿plugins Caja De Comentarios facebook "en modo caja flotante lateral con efecto Deslisante "es posible? en plataforma universal html :p4: ...
    Respuestas: 0
    Último mensaje: 30-dic-2012

Normas de publicación

  • No puedes crear nuevos temas
  • No puedes responder mensajes
  • No puedes subir archivos adjuntos
  • No puedes editar tus mensajes
  •