Staffer Group BR™

Fórum interativo totalmente gratuito!

/* Widget *//* Resposta rápida bloqueada */
Cadastre-se
→ Crie a sua conta

 VisualizaçõesPermissão deste fórum:
Você não pode responder aos tópicos neste fórum


CurtirDiretório deste fórum:
Fóruns » Arquivos » Arquivo

#1
 D'Leandro™

avatar
Fundador
  [Tutorial] Botão para mp rápida

Descrição
O botão fica visivel em todas as páginas e ao clicar abre uma tabela para envio de mensagem rápida.

Funcionalidade: Testado apenas em PhpBB3


--> Código JavaScript <--
Painel de Controle  Seta  Módulos   Seta   HTML & JavaScript   Seta   Gestão dos códigos JavaScript

Adicionar novo Códig
Título * : Opcional.
Investimento :  Em todas as paginas
Código JavaScript * : Cole o código abaixo.

Código:
$(document).ready(function(){
$(".headerbar").before('<br><span id="mp-r">MP RÁPIDA</span><br><br>');
    $("#mp-r").after("<div id='popup' style=''></div>");
    $("#popup").HTML('<div id="X">X</div>'+'<form style="text-align:left" action="/privmsg" method="post" name="post" enctype="multipart/form-data">

<b>Nome de usuário:</b>
<input class="inputbox" name="username" type="text"></input>

<br><br><b>Assunto:</b>
<input class="inputbox" name="subject" type="text"></input>

<br><br><b>Mensagem:</b>
<textarea style="" id="text_editor_treamp" placeholder="Se o Sr. estiver em um tópico os botões podem não aparecer corretamente." name="message"></textarea>

<input name="folder" value="inbox" type="hidden"></input>

<input name="mode" value="post" type="hidden"></input>

<input name="lt" value="" type="hidden"></input><br>

<input name="post" value="Enviar MP" type="submit"></input>

<input type="submit" name="preview" class="" value="Pré-Visualizar"></input></form>');
    $("#X").click(function(){
    $("#popup").fadeOut();
    $(this).fadeOut();
    });
$("#popup").hide();
$("#mp-r").click(function(){
$("#X").fadeToggle();
$("#popup").fadeToggle();
});
    });

Clique em  Confirmar

--> Código CSS <--
Painel de Controle  Seta  Visualização   Seta   Imagens e Cores   Seta   Cores  Seta  Aba "Folha de estilo CSS"

Código:
#text_editor_treamp {
    border-radius: 5px;
    border: none;
    width: 85%;
    margin-bottom: 10px;
}
#popup {
    z-index: 2147483647;
    position: absolute;
    left: 20px;
    top: 465px;
    color: rgb(255, 255, 255);
    border-radius: 5px 5px 5px 5px;
    box-shadow: 0px 0px 3px rgb(0, 0, 0);
    padding: 10px;
    background: none repeat scroll 0% 0% rgba(0, 0, 0, 0.8);
}
#mp-r{
padding:6px;
  transition:all 0.5s;
  border:1px solid blue;
  border-radius:6px;
  background: #f0f9ff; /* Old browsers */
background: -moz-linear-gradient(top,  #f0f9ff 0%, #cbebff 47%, #a1dbff 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f0f9ff), color-stop(47%,#cbebff), color-stop(100%,#a1dbff)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #f0f9ff 0%,#cbebff 47%,#a1dbff 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #f0f9ff 0%,#cbebff 47%,#a1dbff 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #f0f9ff 0%,#cbebff 47%,#a1dbff 100%); /* IE10+ */
background: linear-gradient(to bottom,  #f0f9ff 0%,#cbebff 47%,#a1dbff 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f0f9ff', endColorstr='#a1dbff',GradientType=0 ); /* IE6-9 */
color:whitw;
  font-weight:bold;cursor:pointer;
}
#X {
    background: red;
    cursor: default;
    border-radius: 100px;
    width: 10px;
    height: 10px;
    padding: 4px;
    box-shadow: 0px 0px 3px #000;
    color: white;
    font-weight: bold;
    float: right;
}

Clique em  Validar

--> Resultado Final<--

Clique na imagem para visualizar ▲


Desenvolvido por HenRyqUéè | D'Leandro™
Editado e Postado por Copyright® 2012 Staffer Group BR™
Ver perfil do usuário

#2
 Vargas

avatar
Moderador
Excelente modificação, eu lembro do código original e era muito feio.

@Edit: Conteúdo funcional, com alguns bugs.
Ver perfil do usuário

#3
 Chorão

avatar
Membro
Muito Bom Mano vo postar no meu fórum tomara que de certo!
Ver perfil do usuário

#4
 'Fusion

avatar
Membro
Tá de parabéns gostei muito viu.
Ver perfil do usuário samuca_akira@hotmail.com

#5
 Mr.GamingPT

avatar
Membro
rg
Ver perfil do usuário

#6
 JQuery

avatar
Membro
po
Ver perfil do usuário

#7
 DEMORUTO666

avatar
Membro
bem interessante esse modo de mandar MP
Ver perfil do usuário

#8
 fascicularia

avatar
Membro
thanks
Ver perfil do usuário

#9
 JQuery

avatar
Membro
muito bom msm
Ver perfil do usuário

#10
 sivastar

avatar
Membro
Thanks
Ver perfil do usuário

#11
 Superbomber

avatar
Membro
Show de bola.

Assinatura:
Hacker Justice
Ver perfil do usuário

#12
 DooGy00

avatar
Novato
thanks!
Ver perfil do usuário

#13
 Conteúdo patrocinado