Seleccionar idioma:
Realizar Donación - Mods Premium - Portfolio



Este sitio utiliza cookies propias y de terceros. Si continúa navegando consideramos que acepta el uso de cookies. OK Más Información.
* Como implementar XAT a la izquierda - Deslizante - SMF
  Leído 3958 veces
* Viendo el foro
 0 Usuarios y 1 Visitante están viendo este foro.


Tema Solucionado
*
Dic 05 2012


Buenas noches colegas

En esta ocasión vengo a que me echen una mano con esta inquietud que tengo.

Navegando me encontre con un codigo que sirve para poner nuestro XAT "chat" al lado izquierdo de nuestra pagina web, basicamente funciona como un sliders o algo similar.

He intentado plantar el codigo en MSF y no he podido y tampoco llamando ese archivo por medio del scrip.

Este es el codigo:

Segun el tutorial debemo poner este codigo antes del </head>, pero en este caso yo utilizo el MOD global headers y footers.

Código: [Seleccionar]
<script  type='text/javascript'> function showHideGB(){ var gb =  document.getElementById("gb"); var w = gb.offsetWidth; gb.opened ?  moveGB(0, 47-w) : moveGB(20-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.left = x.toString() + "px";  if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);} } </script>  <div id='gb'><div class='gbtab'  onclick='showHideGB()'></div><div  class='gbcontent'><div  style='line-height:0;background-position:center;width:590px;height:310px;'><embed  align='middle' allowscriptaccess='sameDomain' flashvars='id=[b][color=red]"170058425" Codigo de nuestro xat[/color][/b]'  height='310' name='chat' pluginspage='http://xat.com/update_flash.shtml'  quality='high' src='http://www.xatech.com/web_gear/chat/chat.swf'  type='application/x-shockwave-flash' width='590'  wmode='transparent'/> </div></div></div>
Hasta ahy todo esta bien.

Pero no se donde poner este otro codigo.
Código: [Seleccionar]
#gb  { position:fixed; top:150px; z-index:+1000; left:-610px; } * html #gb {  position:relative; } .gbtab { height:161px; width:47px; float:right;  cursor:pointer; background:url('http://i.imgur.com/WoBz0.png')  no-repeat; margin-top:20px; } .gbcontent { float:left; border:2px solid  #8c00c1; background:#fff; opacity:0.80; -moz-opacity: 0.80; filter:  alpha(opacity=80); -webkit-border-radius: 20px; border-radius: 20px;  -khtml-border-radius: 20px; padding:8px; }[br /] [br /]
Aqui esta el video tutorial.

http://www.youtube.com/watch?v=VZhagd2H_QM&noredirect=1

Si alguien tiene conocimiento, les agradeceria ya que para los foros que apenas enpizan queda muy agradable.

Saludos







*



Fadrox
2.0
www.fadrox.net

Mensajes: 139

Ver Perfil  Email 

« Última Modificación: Diciembre 05, 2012, 11:28:04 am por Enik »
En línea

*
Dic 05 2012


Pero esto es de lo mas facil que puede haber  :o :o :o mira el screen lo logre en un minuto  :P :P :P

Te dire los pasos a seguir:

Index.template

Buscar:
Código: [Seleccionar]
    // Show the menu here, according to the menu sub template.
    template_menu();

Agregar antes:
Código: [Seleccionar]
echo '
  <script  type="text/javascript">
  function showHideGB(){ var gb =  document.getElementById("gb");
  var w = gb.offsetWidth; gb.opened ?  moveGB(0, 47-w) : moveGB(20-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.left = x.toString() + "px";  if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);} }
  </script> 
  <div id="gb"><div class="gbtab"  onclick="showHideGB()"></div><div class="gbcontent"><div style="line-height:0;background-position:center;width:590px;height:310px;"><embed  align="middle" allowscriptaccess="sameDomain" flashvars="id=>>>>>>ID DO XAT<<<<<<<<""  height="310" name="chat" pluginspage="http://xat.com/update_flash.shtml"  quality="high" src="http://www.xatech.com/web_gear/chat/chat.swf"  type="application/x-shockwave-flash" width="590"  wmode="transparent"/> </div></div></div>
  ';


Index.css

Agregar al final:
Código: [Seleccionar]
#gb{
position:fixed;
top:150px;
z-index:+1000;
left:-610px; }

* html #gb { 
 position:relative; } 

.gbtab {
height:161px;
width:47px;
float:right; 
cursor:pointer;
background:url('http://i.imgur.com/WoBz0.png')  no-repeat;
margin-top:20px; }

.gbcontent {
float:left;
border:2px solid  #8c00c1;
background:#fff;
opacity:0.80;
-moz-opacity: 0.80;
filter:  alpha(opacity=80);
-webkit-border-radius: 20px;
border-radius: 20px; 
-khtml-border-radius: 20px;
padding:8px; }

Eso es todo el codigo es mas que facil  ;)

Saludos enik...

SmfPersonal Ex-Project maneger
#1

Mensajes: 3358

Ver Perfil  Email 

En línea

*
Dic 06 2012


Gracias enik, pero te digo que lo intente implementar de esta misma manera y no me dio.

Se que este tipo de chat le va a servir a muchos.

Gracias por tu ayuda.


*



Fadrox
2.0
www.fadrox.net
#2

Mensajes: 139

Ver Perfil  Email 

En línea

*
Dic 06 2012


No entiendo a que te refieres ahi te deje todos los pasos a hacer para que trabaje al 100  :o

SmfPersonal Ex-Project maneger
#3

Mensajes: 3358

Ver Perfil  Email 

En línea

*
Dic 06 2012


Solo queria decirte que lo intente implementar similar a como lo acomodo usted pero con la diferencia a que a mi no me dio.

Ahora que lo instale todo anda bien

Gracias


*



Fadrox
2.0
www.fadrox.net
#4

Mensajes: 139

Ver Perfil  Email 

En línea

*
Dic 07 2012


Ahhh ok me da mucho gusto

Saludos enik...
Enviado desde AdkImode

SmfPersonal Ex-Project maneger
#5

Mensajes: 3358

Ver Perfil  Email 

En línea

*
Feb 06 2013


Hola a todos excelente tutorial me encanto, solo que en mi foro paso algo y no se como corregirlo puse todo segun el tutorial me pueden ayudar miren como quedo

web: www.coversmg.com/2014/index.php

Saludos y espero de su ayuda.

SMF 2.0.2
http://www.coversmg.com/2014/index.php
#6

Mensajes: 42

Ver Perfil  Email 

En línea

*
Feb 06 2013


Hola a todos excelente tutorial me encanto, solo que en mi foro paso algo y no se como corregirlo puse todo segun el tutorial me pueden ayudar miren como quedo

web: www.coversmg.com/2014/index.php

Saludos y espero de su ayuda.

Al darle click a la imagen xat, sale el chat desplegable y todo bien,
no entiendo a que prom te refieres, talvez necesitás borrar el cache para que puedas visualizar los cambios

Adk Portal
2.0 RC5
en construccion
#7

Mensajes: 181

Ver Perfil 

En línea

*
Feb 06 2013


el problema es evidente amigo se me desconfiguro todo el head y el footer ademas se corrio el content del foro asia la izquierda eso es para mi es un problema, por eso pido ayuda

Unido automaticamente - {Febrero 06, 2013, 04:07:59 pm}


Bueno adjunto mi index.template aver si me echan una mano..

SMF 2.0.2
http://www.coversmg.com/2014/index.php
#8

Mensajes: 42

Ver Perfil  Email 

« Última Modificación: Febrero 06, 2013, 04:07:59 pm por MakinaFull »
En línea

*
Feb 06 2013


Podrias dejar los archivos que modificastes?

*¤×•·:.·.:·•×¤* ^HeRaCLeS^ *¤×•·:.·.:·•×¤*
*¤×• Todos los Mp seran ignorados | Solo seran considerados los Mp Solicitados por mi •×¤*
*¤×• All Mp will be ignored | Only considers the Mp requested per my •×¤*

SMFPersonal

Adk Portal 3.0.2
2.0.14
www.smfpersonal.net
#9

Mensajes: 13978

Ver Perfil  SMFPersonal 

En línea




Otros temas de su interes

Estructurale URL amigable Julz Febrero 21, 2018, 06:36:36 am *
Ayudenme amigos porfis alexandra Julio 11, 2010, 03:06:51 pm *
Tengo un problema con el SMF SHOP NaokiSora Julio 19, 2017, 12:08:23 am
ADKBlog Error - No se ven las tildes a la hora de editar el idioma Madirex Febrero 02, 2017, 01:24:12 pm *
Ayuda ancho de Theme Dsv4 kiraonline Junio 05, 2010, 02:03:17 am *
Unos cuantos fallos después de actualizar RC5 SMF logaed Febrero 13, 2011, 09:04:03 pm



Usuario:
Contraseña:
Sesión:
hermes bracelet replica, christian louboutin replica, van cleef and arpels replica, red bottoms replica, cartier love bracelet replica christian louboutin replica, christian louboutin replica, hermes bracelet replica,