como colocar o xat na lateral eu tenhu o tutorial para o blog mais como add no forum

Ver o tópico anterior Ver o tópico seguinte Ir em baixo

Resolvido como colocar o xat na lateral eu tenhu o tutorial para o blog mais como add no forum

Mensagem por •Express em 08/04/12, 12:18 pm

Qual é minha questão:
http://baixerenders.blogspot.com.br/2012/01/tutorial-colocando-xat-na-lateral-do_31.html

queria add esse xat na lateral do meu forum

Medidas que eu tomei para corrigir o problema:
xxxx

Links e imagens do meu problema:
xxx

Endereço do meu fórum:


Versão do meu fórum:
PHPBB3
avatar

•Express
Usuário destaque

Masculino
Inscrito dia : 22/01/2012
Mensagens : 633
Pontos Ativos : 909

Ver perfil do usuário http://tamoemconstrucao.forumeiros.com/

Resolvido Re: como colocar o xat na lateral eu tenhu o tutorial para o blog mais como add no forum

Mensagem por iPrompt em 08/04/12, 12:40 pm

Utiliza este código

<div style="overflow: visible; position: fixed; bottom: 30px; height: 350px; right: 0px; z-index:1000;"><iframe src="URLDOCHATBOXEXTERNO" id="chatboxpop" scrolling="yes" style="height: 350px; float: right; overflow-x: visible; overflow-y: visible; display: none; width:700px" marginwidth="0" marginheight="0" frameborder="0"></iframe><div onclick="jQuery('#chatboxpop').animate({width:'toggle'},1200); jQuery('#chatboxopen,#chatboxclose').toggle();" style="margin-top: 10px; cursor :pointer; float:left"><img src="http://i34.servimg.com/u/f34/16/04/51/75/open10.png" id="chatboxopen" style="display: inline; "><img src="http://i34.servimg.com/u/f34/16/04/51/75/close10.png" id="chatboxclose" style="cursor: pointer; display: none; "></div></div>

URLDOCHATBOXEXTERNO = Troca pela URL do Chat Box Externo
avatar

iPrompt
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 10/02/2012
Mensagens : 5364
Pontos Ativos : 6851

Ver perfil do usuário http://webskins.forumeiros.com/

Resolvido Re: como colocar o xat na lateral eu tenhu o tutorial para o blog mais como add no forum

Mensagem por •Express em 08/04/12, 12:45 pm

@Coper escreveu:Utiliza este código

<div style="overflow: visible; position: fixed; bottom: 30px; height: 350px; right: 0px; z-index:1000;"><iframe src="URLDOCHATBOXEXTERNO" id="chatboxpop" scrolling="yes" style="height: 350px; float: right; overflow-x: visible; overflow-y: visible; display: none; width:700px" marginwidth="0" marginheight="0" frameborder="0"></iframe><div onclick="jQuery('#chatboxpop').animate({width:'toggle'},1200); jQuery('#chatboxopen,#chatboxclose').toggle();" style="margin-top: 10px; cursor :pointer; float:left"><img src="http://i34.servimg.com/u/f34/16/04/51/75/open10.png" id="chatboxopen" style="display: inline; "><img src="http://i34.servimg.com/u/f34/16/04/51/75/close10.png" id="chatboxclose" style="cursor: pointer; display: none; "></div></div>

URLDOCHATBOXEXTERNO = Troca pela URL do Chat Box Externo


na onde implanto esse codigo?
avatar

•Express
Usuário destaque

Masculino
Inscrito dia : 22/01/2012
Mensagens : 633
Pontos Ativos : 909

Ver perfil do usuário http://tamoemconstrucao.forumeiros.com/

Resolvido Re: como colocar o xat na lateral eu tenhu o tutorial para o blog mais como add no forum

Mensagem por iPrompt em 08/04/12, 12:51 pm

Painel de Controle Seta Visualização Seta Página Inicial Seta Geral
avatar

iPrompt
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 10/02/2012
Mensagens : 5364
Pontos Ativos : 6851

Ver perfil do usuário http://webskins.forumeiros.com/

Resolvido Re: como colocar o xat na lateral eu tenhu o tutorial para o blog mais como add no forum

Mensagem por •Express em 08/04/12, 12:58 pm

nao teria aquele codigo?
avatar

•Express
Usuário destaque

Masculino
Inscrito dia : 22/01/2012
Mensagens : 633
Pontos Ativos : 909

Ver perfil do usuário http://tamoemconstrucao.forumeiros.com/

Resolvido Re: como colocar o xat na lateral eu tenhu o tutorial para o blog mais como add no forum

Mensagem por iPrompt em 08/04/12, 12:59 pm

Olá oque você deseja e mudar as Imagens e Abri e fechar se for Eu posso mudar e por Igual aquelas

Ou tente este código

Código:
<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=165636905' 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>
avatar

iPrompt
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 10/02/2012
Mensagens : 5364
Pontos Ativos : 6851

Ver perfil do usuário http://webskins.forumeiros.com/

Resolvido Re: como colocar o xat na lateral eu tenhu o tutorial para o blog mais como add no forum

Mensagem por •Express em 08/04/12, 01:08 pm

coper talvez tu edita o codigo que tu passo aquele do abrir e fechar


editando a borda coloca igual aquela

coloca a msm velocidade igual aquela

e a imagem xat pode deixar que eu mudo e so falar a onde ela fica
avatar

•Express
Usuário destaque

Masculino
Inscrito dia : 22/01/2012
Mensagens : 633
Pontos Ativos : 909

Ver perfil do usuário http://tamoemconstrucao.forumeiros.com/

Resolvido Re: como colocar o xat na lateral eu tenhu o tutorial para o blog mais como add no forum

Mensagem por iPrompt em 08/04/12, 01:18 pm

Adiciona este código em sua Folha de estilo CSS

Código:
#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://i39.tinypic.com/35btjso.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; }

E Depois adiciona este código em

Painel de Controle Seta Visualização Seta Página Inicial Seta Geral

<div style="overflow: visible; position: fixed; bottom: 30px; height: 350px; right: 0px; z-index:1000;"><iframe src="URLDOCHATBOXEXTERNO" id="chatboxpop" scrolling="yes" style="height: 350px; float: right; overflow-x: visible; overflow-y: visible; display: none; width:700px" marginwidth="0" marginheight="0" frameborder="0"></iframe><div onclick="jQuery('#chatboxpop').animate({width:'toggle'},1200); jQuery('#chatboxopen,#chatboxclose').toggle();" style="margin-top: 10px; cursor :pointer; float:left"><img src="URL DA IMAGEM DO ABRI" id="chatboxopen" style="display: inline; "><img src="URL DA IMAGEM DO FECHAR" id="chatboxclose" style="cursor: pointer; display: none; "></div></div>

URL DA IMAGEM DO ABRI = Troca pela URL da imagem do Abrir
URL DA IMAGEM DO FECHAR = Troca pela URL da imagem do Fechar
URLDOCHATBOXEXTERNO = URL do ChatBox Externo
avatar

iPrompt
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 10/02/2012
Mensagens : 5364
Pontos Ativos : 6851

Ver perfil do usuário http://webskins.forumeiros.com/

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo

- Tópicos similares

Permissão deste fórum:
Você não pode responder aos tópicos neste fórum