Botões BBCode e Enviar Chatbox

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

Resolvido Botões BBCode e Enviar Chatbox

Mensagem por IsmaelS. em 30/07/14, 11:24 am


  • Descrição:

Queria colocar os botões de BBCode e Enviar desta forma:



Já coloquei um código, só que o botão de "Enviar" está na mesma e os botões de BBCode apenas falta colocar o texto dentro "Bolid, Italic, Underline, Strike, Color, Smilies".



  • Informações:




Fórum:http://master-publicitario.forumeiros.com/forumVersão:PUNBB
Tipo:Erros diversosTags:Botões,BBCode,Enviar,Chatbox



Última edição por IsmaelS. em 12/08/14, 07:22 pm, editado 2 vez(es)

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Botões BBCode e Enviar Chatbox

Mensagem por Sennior em 30/07/14, 11:46 pm

Saudações! Muito feliz

Aceda à tua "Folha de estilo CSS":
Painel de Controle  Seta  Visualização  Seta  Imagens e cores  Seta  Cores  Seta  Folha de estilo CSS

Código:
Código:
input#submit_button {
-moz-border-radius: 2px;
-moz-box-shadow: rgba(0,0,0,0.43) 0 1px 3px;
-webkit-border-radius: 2px;
-webkit-box-shadow: rgba(0,0,0,0.43) 0 1px 3px!important;
background: #646464 url(http://i58.servimg.com/u/f58/18/62/03/31/highli17.png) repeat-x 0 0!important;
border: 1px solid #585858!important;
border-radius: 2px!important;
box-shadow: rgba(0,0,0,0.43) 0 1px 3px!important;
color: #fff!important;
font-family: tahoma,helvetica,arial,sans-serif!important;
font-size: 13px!important;
font-style: normal!important;
font-variant: normal!important;
font-weight: 400!important;
padding: 2px 5px!important;
position: relative!important;
text-shadow: #474747 0 -1px 0!important;
top: -2px!important;
}
Depois, mande-me tua Folha de Estilo CSS.

Melhores cumprimentos,
Sennior. De bem com a vida
avatar

Sennior
Membro profissional
Membro profissional

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16302
Pontos Ativos : 20791

Ver perfil do usuário http://ajuda.forumeiros.com/forum https://www.facebook.com/GlladstonHenrique

Resolvido Re: Botões BBCode e Enviar Chatbox

Mensagem por IsmaelS. em 30/07/14, 11:53 pm

O botão "Enviar" resultou só falta colocar o texto dentro dos botões de BBCode, a CSS:
http://pastebin.com/DGLbFYaH

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Botões BBCode e Enviar Chatbox

Mensagem por IsmaelS. em 31/07/14, 08:02 am

PS: Desculpem o Double-Post, tópico editado com link direito!

Amigo uma coisa , eu adicionei o código todo do Chatbox que estava a modificar no fórum:
Código:
#chatbox_messenger_form div.right img {
visibility: hidden;
}
#chatbox_header.main-head {
background: url(http://i78.servimg.com/u/f78/17/31/71/58/mainti10.png) repeat-x bottom #1f537b;
padding: 3px 4px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-khtml-border-radius: 5px;
border-radius: 5px;
min-height: 6px;
}
.chatbox-options li, .chatbox-options li a, .chatbox-options li label {
color: #fff;
}
body[bgcolor] {background: #FCFCFF;}
.main-content.chatbox {
background-color: #FCFCFF;
padding: 10px;
border: 1px solid rgb(204, 204, 204);
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px;
padding-bottom: 0px;
}
#chatbox_members {
background: rgb(246, 246, 248);
border: 1px solid rgb(204, 204, 204);
margin: 4px;
top: 43px;
bottom: 28px;
right: 10;
}
#chatbox_members .member-title {
background: url(http://i78.servimg.com/u/f78/17/31/71/58/mainti10.png) repeat-x bottom #363636;
color: #fff;
padding: 5px;
text-align: left;
padding: 8px 10px;
}
#chatbox p {
background: transparent;
padding: 5px;
line-height: 1.3em;
}
#chatbox p span[style="color:green;"], #chatbox p span[style="color:red;"] {
}
input#message.post:focus {
background: rgb(255,255,240) url('http://i58.servimg.com/u/f58/18/24/85/15/form-e10.png') repeat-x;
border-top-color: rgb(150,150,150);
border-bottom-color: rgb(230,230,230);
}
#simple-wrap {
background:white;
}
#chatbox_top {
min-height: 280px;
}
#chatbox{
top: 43px;
bottom: 28px;
margin: 5px;
background: rgb(246, 246, 248);
border: 1px solid rgb(204, 204, 204);
padding: 5px;
right: 198px;
left:0;
}
#chatbox_footer {
border-top: none!important; 
}
html { background: white !important; }
.fontbutton {
-moz-border-radius: 2px;
-moz-box-shadow: rgba(0,0,0,0.43) 0 1px 3px;
-webkit-border-radius: 2px;
-webkit-box-shadow: rgba(0,0,0,0.43) 0 1px 3px !important;
background: #646464 url(http://i58.servimg.com/u/f58/18/62/03/31/highli17.png) repeat-x 0 0 !important;
border: 1px solid #585858!important;
border-radius: 2px !important;
box-shadow: rgba(0,0,0,0.43) 0 1px 3px !important;
color: #fff !important;
font-family: tahoma,helvetica,arial,sans-serif !important;
font-size: 13px !important;
font-style: normal !important;
font-variant: normal !important;
font-weight: normal !important;
padding: 2px 5px !important;
text-shadow: #474747 0 -1px 0 !important;
position: relative !important;
top: -2px !important;
}
input#submit_button {
-moz-border-radius: 2px;
-moz-box-shadow: rgba(0,0,0,0.43) 0 1px 3px;
-webkit-border-radius: 2px;
-webkit-box-shadow: rgba(0,0,0,0.43) 0 1px 3px!important;
background: #646464 url(http://i58.servimg.com/u/f58/18/62/03/31/highli17.png) repeat-x 0 0!important;
border: 1px solid #585858!important;
border-radius: 2px!important;
box-shadow: rgba(0,0,0,0.43) 0 1px 3px!important;
color: #fff!important;
font-family: tahoma,helvetica,arial,sans-serif!important;
font-size: 13px!important;
font-style: normal!important;
font-variant: normal!important;
font-weight: 400!important;
padding: 2px 5px!important;
position: relative!important;
text-shadow: #474747 0 -1px 0!important;
top: -2px!important;
}
#chatbox span[style="font-style:italic"]:after {
content: " Clique em login para Entrar!";
}
#chatbox span[style="font-style:italic"] {
background: url('http://i55.servimg.com/u/f55/18/71/50/00/highli10.png') repeat-x scroll 0px 0px #F3E3E6;
border: 1px solid #E599AA;
box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
color: #80001C;
display: block;
font-size: 14px;
font-style: normal !important;
font-weight: 700;
line-height: 1.6;
padding: 10px;
text-align: center;
text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.55);
}

Mas tem um problema, não aparece no lado direito aquela parte de "Conectados" e "Ausente" !

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Botões BBCode e Enviar Chatbox

Mensagem por IsmaelS. em 01/08/14, 05:23 am

UP!

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Botões BBCode e Enviar Chatbox

Mensagem por Alex Habilidade em 01/08/14, 10:04 pm

Olá,

Troque o seu código passado acima por este:
Código:

#chatbox_header.main-head {
background: url(http://i78.servimg.com/u/f78/17/31/71/58/mainti10.png) repeat-x bottom #1f537b;
padding: 3px 4px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-khtml-border-radius: 5px;
border-radius: 5px;
min-height: 6px;
}
.chatbox-options li, .chatbox-options li a, .chatbox-options li label {
color: #fff;
}
body[bgcolor] {background: #FCFCFF;}
.main-content.chatbox {
background-color: #FCFCFF;
padding: 10px;
border: 1px solid rgb(204, 204, 204);
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px;
padding-bottom: 0px;
}
#chatbox_members {
background: rgb(246, 246, 248);
border: 1px solid rgb(204, 204, 204);
margin: 4px;
top: 43px;
bottom: 28px;
right: 10;
}
#chatbox_members .member-title {
background: url(http://i78.servimg.com/u/f78/17/31/71/58/mainti10.png) repeat-x bottom #363636;
color: #fff;
padding: 5px;
text-align: left;
padding: 8px 10px;
}
#chatbox p {
background: transparent;
padding: 5px;
line-height: 1.3em;
}
#chatbox p span[style="color:green;"], #chatbox p span[style="color:red;"] {
}
input#message.post:focus {
background: rgb(255,255,240) url('http://i58.servimg.com/u/f58/18/24/85/15/form-e10.png') repeat-x;
border-top-color: rgb(150,150,150);
border-bottom-color: rgb(230,230,230);
}
#simple-wrap {
background:white;
}
#chatbox_top {
min-height: 280px;
}
#chatbox{
top: 43px;
bottom: 28px;
margin: 5px;
background: rgb(246, 246, 248);
border: 1px solid rgb(204, 204, 204);
padding: 5px;
right: 198px;
left:0;
}
#chatbox_footer {
border-top: none!important; 
}
html { background: white !important; }
.fontbutton {
-moz-border-radius: 2px;
-moz-box-shadow: rgba(0,0,0,0.43) 0 1px 3px;
-webkit-border-radius: 2px;
-webkit-box-shadow: rgba(0,0,0,0.43) 0 1px 3px !important;
background: #646464 url(http://i58.servimg.com/u/f58/18/62/03/31/highli17.png) repeat-x 0 0 !important;
border: 1px solid #585858!important;
border-radius: 2px !important;
box-shadow: rgba(0,0,0,0.43) 0 1px 3px !important;
color: #fff !important;
font-family: tahoma,helvetica,arial,sans-serif !important;
font-size: 13px !important;
font-style: normal !important;
font-variant: normal !important;
font-weight: normal !important;
padding: 2px 5px !important;
text-shadow: #474747 0 -1px 0 !important;
position: relative !important;
top: -2px !important;
}
input#submit_button {
-moz-border-radius: 2px;
-moz-box-shadow: rgba(0,0,0,0.43) 0 1px 3px;
-webkit-border-radius: 2px;
-webkit-box-shadow: rgba(0,0,0,0.43) 0 1px 3px!important;
background: #646464 url(http://i58.servimg.com/u/f58/18/62/03/31/highli17.png) repeat-x 0 0!important;
border: 1px solid #585858!important;
border-radius: 2px!important;
box-shadow: rgba(0,0,0,0.43) 0 1px 3px!important;
color: #fff!important;
font-family: tahoma,helvetica,arial,sans-serif!important;
font-size: 13px!important;
font-style: normal!important;
font-variant: normal!important;
font-weight: 400!important;
padding: 2px 5px!important;
position: relative!important;
text-shadow: #474747 0 -1px 0!important;
top: -2px!important;
}
#chatbox span[style="font-style:italic"]:after {
content: " Clique em login para Entrar!";
}
#chatbox span[style="font-style:italic"] {
background: url('http://i55.servimg.com/u/f55/18/71/50/00/highli10.png') repeat-x scroll 0px 0px #F3E3E6;
border: 1px solid #E599AA;
box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
color: #80001C;
display: block;
font-size: 14px;
font-style: normal !important;
font-weight: 700;
line-height: 1.6;
padding: 10px;
text-align: center;
text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.55);
}
avatar

Alex Habilidade
Usuário experiente

Masculino
Inscrito dia : 10/01/2011
Mensagens : 2795
Pontos Ativos : 3774

Ver perfil do usuário http://www.gzhabilidade.com/

Resolvido Re: Botões BBCode e Enviar Chatbox

Mensagem por IsmaelS. em 02/08/14, 06:59 am

Continua na mesma!

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Botões BBCode e Enviar Chatbox

Mensagem por Alex Habilidade em 02/08/14, 10:14 am

Por favor, me forneça todo o seu código CSS, para eu analisar.
avatar

Alex Habilidade
Usuário experiente

Masculino
Inscrito dia : 10/01/2011
Mensagens : 2795
Pontos Ativos : 3774

Ver perfil do usuário http://www.gzhabilidade.com/

Resolvido Re: Botões BBCode e Enviar Chatbox

Mensagem por IsmaelS. em 02/08/14, 10:47 am


IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Botões BBCode e Enviar Chatbox

Mensagem por Alex Habilidade em 03/08/14, 08:22 am

Troque seu CSS por esste:
http://pastebin.com/4iBnSHbn

Bom final de semana amigo.
avatar

Alex Habilidade
Usuário experiente

Masculino
Inscrito dia : 10/01/2011
Mensagens : 2795
Pontos Ativos : 3774

Ver perfil do usuário http://www.gzhabilidade.com/

Resolvido Re: Botões BBCode e Enviar Chatbox

Mensagem por IsmaelS. em 03/08/14, 11:45 am

Olá,

Eu queria na parte dos botões de BBCode assim:



Em vez de aparecer os ícones queria dentro deles a dizer "Bolid, Italic, Underline, Strike, Color, Smilies" e continua a não aparecer a parte de "Online" e "Ausente" dos usuários no chatbox!

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Botões BBCode e Enviar Chatbox

Mensagem por IsmaelS. em 04/08/14, 08:15 pm

UP!

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Botões BBCode e Enviar Chatbox

Mensagem por Alex Habilidade em 05/08/14, 11:31 am

Poderia me passar o fórum que tem esse chat?
avatar

Alex Habilidade
Usuário experiente

Masculino
Inscrito dia : 10/01/2011
Mensagens : 2795
Pontos Ativos : 3774

Ver perfil do usuário http://www.gzhabilidade.com/

Resolvido Re: Botões BBCode e Enviar Chatbox

Mensagem por IsmaelS. em 05/08/14, 11:42 am


IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Botões BBCode e Enviar Chatbox

Mensagem por IsmaelS. em 05/08/14, 08:05 pm

UP!

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Botões BBCode e Enviar Chatbox

Mensagem por Alex Habilidade em 06/08/14, 08:04 pm

Olá,

Crie uma nova página Javascript com investimento em todas as páginas e coloque o código abaixo:
Código:

$(function(){
    var pop = $("#chatboxpop").contents();
    pop.find("#divbold").html('Bold');
    pop.find("#divitalic").html('Italic');
    pop.find("#divunderline").html('Underline');
    pop.contents().find("#divstrike").html('Strike');
    pop.find("#divcolor").html('Color');
    pop.find("#divsmilies").html('Smilies');
});
avatar

Alex Habilidade
Usuário experiente

Masculino
Inscrito dia : 10/01/2011
Mensagens : 2795
Pontos Ativos : 3774

Ver perfil do usuário http://www.gzhabilidade.com/

Resolvido Re: Botões BBCode e Enviar Chatbox

Mensagem por IsmaelS. em 06/08/14, 08:29 pm

Continua na mesma amigo!

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Botões BBCode e Enviar Chatbox

Mensagem por Sennior em 06/08/14, 11:18 pm

Saudações,

Altere por este código JavaScript com investimento em todas as páginas:
Código:
$(".fontbutton").ready(function(){
$("div#divbold").text("Bold");
$("div#divitalic").text("Italic");
$("div#divunderline").text("Underline");
$("div#divstrike").text("Strike");
$("div#divcolor").text("Color");
$("div#divsmilies").text("Smilies");
});

Até mais.
avatar

Sennior
Membro profissional
Membro profissional

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16302
Pontos Ativos : 20791

Ver perfil do usuário http://ajuda.forumeiros.com/forum https://www.facebook.com/GlladstonHenrique

Resolvido Re: Botões BBCode e Enviar Chatbox

Mensagem por IsmaelS. em 06/08/14, 11:26 pm

Continua igual amigo!

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Botões BBCode e Enviar Chatbox

Mensagem por Sennior em 06/08/14, 11:51 pm

Saudações,

O código é funcional... Estranho.
Mande-me o código que usa no Widget para fazer aquele Chatbox. Irei colocar o código JavaScript no código HTML que esta usando. Positivo

Abraços.
avatar

Sennior
Membro profissional
Membro profissional

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16302
Pontos Ativos : 20791

Ver perfil do usuário http://ajuda.forumeiros.com/forum https://www.facebook.com/GlladstonHenrique

Resolvido Re: Botões BBCode e Enviar Chatbox

Mensagem por IsmaelS. em 07/08/14, 12:35 am

Aqui está:
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://i.imgur.com/NfjAClT.png" id="chatboxopen" style="display: inline; " /><img src="http://i.imgur.com/hRUd45T.png" id="chatboxclose" style="cursor: pointer; display: none; " />
   </div>
</div>

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Botões BBCode e Enviar Chatbox

Mensagem por Alex Habilidade em 07/08/14, 07:51 pm

Substitua o código JS por este:
Código:

$(window).load(function(){
var pop = $("#chatboxpop").contents();
    pop.find("#divbold").html('Bold');
    pop.find("#divitalic").html('Italic');
    pop.find("#divunderline").html('Underline');
    pop.contents().find("#divstrike").html('Strike');
    pop.find("#divcolor").html('Color');
    pop.find("#divsmilies").html('Smilies');
});
avatar

Alex Habilidade
Usuário experiente

Masculino
Inscrito dia : 10/01/2011
Mensagens : 2795
Pontos Ativos : 3774

Ver perfil do usuário http://www.gzhabilidade.com/

Resolvido Re: Botões BBCode e Enviar Chatbox

Mensagem por IsmaelS. em 07/08/14, 07:53 pm

Olá,

Já apareceu, só que ficou à frente e se clicar não funciona o Negrito e Itálico! E não aparece quem está conectado no chatbox ainda!

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Botões BBCode e Enviar Chatbox

Mensagem por IsmaelS. em 08/08/14, 03:51 pm

UP!

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Botões BBCode e Enviar Chatbox

Mensagem por Alex Habilidade em 09/08/14, 04:26 pm

Poderia mostrar um print por favor.
avatar

Alex Habilidade
Usuário experiente

Masculino
Inscrito dia : 10/01/2011
Mensagens : 2795
Pontos Ativos : 3774

Ver perfil do usuário http://www.gzhabilidade.com/

Resolvido Re: Botões BBCode e Enviar Chatbox

Mensagem por IsmaelS. em 09/08/14, 05:04 pm

Olá,

Aqui está:


IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Botões BBCode e Enviar Chatbox

Mensagem por IsmaelS. em 10/08/14, 02:16 pm

UP!

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.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