Chatbox escondido

Detalhes da questão

Endereço do fórum: http://17bpm.forumeiros.com
Versão do fórum: PunBB

Descrição

Olá pessoal, gostaria desse ChatBox:

https://i.imgur.com/9dc9LFi.png

Fórum onde vi: http://www.heroisdoolimporpg.com/

Seria possível? Desde já agradeço.

Olá, bom dia.

Leia este tutorial:
-> https://ajuda.forumeiros.com/t56724-tutorial-chatbox-retratil-no-canto-do-forum

Creio que o resto o senhor consegue personalizar via CSS.

Sem resultado :/

Olá,

Crie um novo JavaScript, investido em todas as páginas, com o código:

Código:

(function ($) {
  'use strict';

  $(function () {
    $('body')
      .append([
        '',
        '<div id="lz-chat">',
        '  <iframe src="/chatbox/index.forum?" id="chatboxpop" scrolling="yes" marginwidth="0" marginheight="0" frameborder="0"></iframe>',
        '  <div id="lz-popup">',
        '    <img src="http://i.imgur.com/uOqXEzM.png" id="chatboxopen" style="display: inline;">',
        '    <img src="http://i.imgur.com/jOydylt.png" id="chatboxclose" style="cursor: pointer; display: none;">',
        '  </div>',
        '</div>',
        '',
        '<style type="text/css">',
        '  #lz-chat {',
        '    overflow: visible;',
        '    position: fixed;',
        '    bottom: 110px;',
        '    height: 350px;',
        '    right: 0px;',
        '    z-index: 1000;',
        '  }',
        '',
        '  #chatboxpop {',
        '    height: 450px;',
        '    float: right;',
        '    overflow: hidden;',
        '    width: 750px;',
        '    display: none;',
        '  }',
        '',
        '  #lz-popup {',
        '    margin-top: 10px;',
        '    cursor :pointer;',
        '    float:left;',
        '  }',
        '</style>',
        '',
      ].join('\n'))
    ;

    $('#lz-popup').on('click', function () {
      $('#chatboxpop')
        .animate({width:'toggle'},700)
      ;
      $('#chatboxopen,#chatboxclose')
        .toggle()
      ;
    });
   
  });
}(jQuery));

o/

---

Tópico movido de 'Questões sobre a aparência do fórum' para 'Questões sobre códigos'

Beleza, resultou mas aí está outro problema: https://i.imgur.com/vxGqex4.png
Ambos os chatsbox ficam assim.

iScroll escreveu:Ambos os chatsbox ficam assim.

Na verdade, eles não ficaram assim, eles já estavam assim.

É impossível torná-lo perfeito, este é o melhor que dá para fazer:

Código:

body[bgcolor][text][link] {
  height: 99%;
  width: 100%;
  position: absolute!important;
}

div#chatbox_footer {
  display: block;
  position: absolute;
  bottom: 7px;
  border: 0px;
  background-color: #fff;
  z-index: 999;
}

Coloque ao final de sua CSS, @iScroll.

Olá, teria como retirar o chatbox normal e deixar apenas o lateral >> ?
E os avatares não aparecem também, dá para resolver?
Veja : https://i.imgur.com/Hb0BO7f.png

Olá,

Para que o chatbox "lateral" funcione, o senhor deve manter o chatbox "original" ativo, visto que um é necessário para o outro.

Para mim, as imagens estão ok.
Tente limpar o histórico de navegação/cookies, e veja se resolve.

Luiz~ escreveu:Olá,

Para que o chatbox "lateral" funcione, o senhor deve manter o chatbox "original" ativo, visto que um é necessário para o outro.

Para mim, as imagens estão ok.
Tente limpar o histórico de navegação/cookies, e veja se resolve.

Mas não há uma maneira de oculta-lo da pagina inicial e deixar apenas o lateral ?

Sim, basta usar este CSS:

Código:

div.main div.chatbox {
  display: none;
}

o/

Valeu luiz! Resolveu