Chat lateral com defeito

Qual é minha questão:
Eu coloquei o chat lateral no meu fórum e ele mostrou problema. Veja nessa imagem:

https://2img.net/h/oi48.tinypic.com/2urqfti.png

Como podem ver. A parte dos tópicos foi mais para aquele lado <<< . Mais o chat funciona normalmente.

Foi nesse tutorial que eu vi o código.

https://ajuda.forumeiros.com/t57261-tutorial-chat-box-retratil-lateral

Medidas que eu tomei para corrigir o problema:
Nenhuma.

Links e imagens do meu problema:
https://2img.net/h/oi48.tinypic.com/2urqfti.png

Endereço do meu fórum:
http://rpgheroisdolimpo.forumeiros.com/

Versão do meu fórum:
PHPBB2

Boa noite.

Poderia manter o código ativo para que eu possa visualizar o erro?

Cordialmente.

Código:

 <div style="overflow: visible; position: fixed; bottom: 30px; height: 350px; right: 0px; z-index:1000;"><iframe src="/chatbox" 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>

Aqui está o código que eu usei .

Olá e boa Noite;
Troque por este:

Código:

<div style="overflow: visible; position: fixed; bottom: 30px; height: 250px; right: 0px; z-index:1000;"><iframe src="/chatbox" 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>

Atenciosamente,
House

Ola,

Troque o codigo por esse :

Código:


 <div style="overflow: visible; position: fixed; bottom: 29px; height: 300px; right: 0px; z-index:1000;"><iframe src="/chatbox" 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>


Ate mais !

Não resolveu. O problema é que a parte dos tópicos fica longe do contorno, quando se coloca o chat;. Como na imagem:
https://2img.net/h/oi48.tinypic.com/2urqfti.png .

Veja, que as partes dos tópicos fica longe do contorno que é a risca branca. O correto é ela ficar colada na risca. Mais só fica longe da risca quando coloca o chat. E quando eu tiro volta ao normal.

No meu forum eu uso essa codigo manolo:

Código:

 <div style="overflow: visible; position: fixed; bottom: 30px; height: 350px; right: 0px; z-index:1000;"><iframe src="/chatbox" 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>

Veja se funcione no seu também

Não Funcionou.

Olá amigo!

Cpainel > Visualização > Templates > Geral > overall_header e adicione o seu código abaixo do código:

Código:

<body>

Atenciosamente,
Shek

Desculpe, mais eu não entendi o que você disse.

Olá!

O problema ocorre porque quando você utiliza o código, ele ativa os Widgets, porém como os Widgets não tem nada para ser visualizado, fica um espaço em branco.

Aceda à "Gestão dos códigos JavaScript":
Painel de Controle Módulos Gestão dos códigos JavaScript

Clique em "Criar um novo JavaScript".

Título Escolha o título que quiser
Investimento Em todas as páginas

Codigo JavaScript:

var aspas="'";jQuery(document).ready(function(){jQuery('body').prepend('<div style="overflow: visible; position: fixed; bottom: 29px; height: 300px; right: 0px; z-index:1000;"><iframe src="/chatbox" 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('+aspas+'#chatboxpop'+aspas+').animate({width:'+aspas+'toggle'+aspas+'},1200); jQuery('+aspas+'#chatboxopen,#chatboxclose'+aspas+').toggle();" style="margin-top: 10px; cursor :pointer; float:left"><img src="https://i.servimg.com/u/f34/16/04/51/75/open10.png" id="chatboxopen" style="display: inline; "><img src="https://i.servimg.com/u/f34/16/04/51/75/close10.png" id="chatboxclose" style="cursor: pointer; display: none; "></div></div>')});

Clique em "Confirmar".

Até mais.

Funcionou. Obrigado.

Como troca imagens?