[Tutorial] Botão para mp rápida |
Painel de Controle Módulos HTML & JavaScript Gestão dos códigos JavaScript
Título * : Opcional.
Investimento :
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
Painel de Controle Visualização Imagens e Cores Cores 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
Clique na imagem para visualizar ▲
Desenvolvido por HenRyqUéè | D'Leandro
Editado e Postado por Copyright® 2012 Staffer Group BR
Editado e Postado por Copyright® 2012 Staffer Group BR