Personalizar o botão "novo tópico" - fórmulário

+2
Mikáá
Cristian 95
6 participantes

Ir para baixo

Tópico resolvido Personalizar o botão "novo tópico" - fórmulário

Mensagem por Cristian 95 30.12.10 19:02

Olá galera.. eu queria editar meu fórum pra deixar os "novo tópico" assim.. quando criar em "novo tópico" ele vai pra cá


eu queria deixar assim.. alguem me ajuda? fico grato.
Cristian 95
Cristian 95
Membro

Membro desde : 16/12/2010
Mensagens : 946
Pontos : 1278

http://secondlifevirtual.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Personalizar o botão "novo tópico" - fórmulário

Mensagem por Mikáá 30.12.10 19:06

Boa tarde,

Veja o ponto 6 deste tutorial: https://ajuda.forumeiros.com/-t35148.htm

Até mais.
Mikáá
Mikáá
Hiper Membro

Membro desde : 13/02/2010
Mensagens : 3158
Pontos : 4014

https://www.facebook.com/amo.e.odeio

Ir para o topo Ir para baixo

Tópico resolvido Re: Personalizar o botão "novo tópico" - fórmulário

Mensagem por Cristian 95 30.12.10 19:14

Não entendi, poderia explicar melhor?
Cristian 95
Cristian 95
Membro

Membro desde : 16/12/2010
Mensagens : 946
Pontos : 1278

http://secondlifevirtual.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Personalizar o botão "novo tópico" - fórmulário

Mensagem por Mikáá 30.12.10 19:17

Olá novamente,
Primeiro de tudo terá de criar um formulário (o FDF já não os faz apenas ajuda) e depois coloca-lo numa página HTML em seu fórum. Depois terá de pegar o código (o que está no ponto 6 do tutorial) e coloca-lo em outra página HTML em seu fórum. Finalmente terá de criar um código script (que também está no tutorial) e coloca-lo na descrição em seu fórum.

Como vê não é fácil de o fazer Piscada

Até mais.
Mikáá
Mikáá
Hiper Membro

Membro desde : 13/02/2010
Mensagens : 3158
Pontos : 4014

https://www.facebook.com/amo.e.odeio

Ir para o topo Ir para baixo

Tópico resolvido Re: Personalizar o botão "novo tópico" - fórmulário

Mensagem por Cristian 95 30.12.10 22:15

Ainda sim não entendi.. ._.
Cristian 95
Cristian 95
Membro

Membro desde : 16/12/2010
Mensagens : 946
Pontos : 1278

http://secondlifevirtual.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Personalizar o botão "novo tópico" - fórmulário

Mensagem por BlueAngel 31.12.10 5:23

Prezado Cristian 95,

Primeiro de tudo terá de criar um formulário (o FDF já não os faz apenas ajuda) e depois coloca-lo numa página HTML em seu fórum. Depois terá de pegar o código (o que está no ponto 6 do tutorial) e coloca-lo em outra página HTML em seu fórum. Finalmente terá de criar um código script (que também está no tutorial) e coloca-lo na descrição em seu fórum.

Como vê não é fácil de o fazer

Até mais.

Ele diz aqui que terá de criar uma nova página HTML, criar um formulário, terá de colocar um código em outra página, e depois de tudo criar um código script. Ou seja, você terra um desgastante tempo para fazer essas alterações, terá de mudar realmente a página de seu fórum ^^ !

Abraços Piscada
Rav.
BlueAngel
BlueAngel
Super Membro

Membro desde : 14/09/2009
Mensagens : 1128
Pontos : 1606

http://finite.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Personalizar o botão "novo tópico" - fórmulário

Mensagem por Cristian 95 31.12.10 16:08

E você não teria o script ai pronto? ._.
Cristian 95
Cristian 95
Membro

Membro desde : 16/12/2010
Mensagens : 946
Pontos : 1278

http://secondlifevirtual.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Personalizar o botão "novo tópico" - fórmulário

Mensagem por muryllodantas 31.12.10 16:26

Cristian 95 escreveu:E você não teria o script ai pronto? ._.

Você que este? http://rendersdesigner.forumeiro.com/h1-

Se for a muitos topicos com ele
muryllodantas
muryllodantas
Membro

Membro desde : 31/10/2010
Mensagens : 760
Pontos : 1013

http://rendersdesigner.forumeiro.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Personalizar o botão "novo tópico" - fórmulário

Mensagem por Cristian 95 31.12.10 17:28

Sim.. é assim mesmo, só muda os nomes, que não deve ser tão dificil, eu faço aqui. poderia me passar? fico muito grato a ti.
Cristian 95
Cristian 95
Membro

Membro desde : 16/12/2010
Mensagens : 946
Pontos : 1278

http://secondlifevirtual.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Personalizar o botão "novo tópico" - fórmulário

Mensagem por muryllodantas 31.12.10 17:36

Peça a um dos staffers, eu lhe passo o codigo e eles editam.

O formulario:

Código:
<style>
.previsu {
 background: url('http://sd-1.archive-host.com/membres/images/142586199450897653/LFD/vide.png');
 border: 1px solid #1675BC;
 display: none;
 position: absolute;
 top: 350px;
 margin: auto;
 margin-left: 150px !important;
}
 .previsuimg {
 position: relative;
 }
 .previsuimg div {
 position: absolute; top: 30px; left: -10px; border: 3px double #E0E0E0; background: rgba(250, 250, 250, 0.9);
 }
 
 
#addimage .part { background: url(http://i46.tinypic.com/2wrdc42.jpg) no-repeat -235px -600px; width: 60px; height: 20px;}
#addimage .more { background: url(http://i46.tinypic.com/2wrdc42.jpg) no-repeat 0px 2px; width: 12px; height: 20px; cursor:pointer;}
.image .part { background: url(http://i46.tinypic.com/2wrdc42.jpg) no-repeat -235px -548px; width: 60px; height: 20px;}
.image .remove { float: left;background: url(http://i46.tinypic.com/2wrdc42.jpg) no-repeat 0px -286px;padding-left: 16px;width: 12px; height: 20px; cursor:pointer;position: relative;top:3px;}
.image .previsualise { float: left;background: url(http://i46.tinypic.com/2wrdc42.jpg) no-repeat -50px -436px; margin-left: 5px; padding-left: 16px;width: 12px; height: 20px; cursor:pointer;position: relative;top:3px;}
 
 .image { width: 300px; }
 
</style>
<script type="text/javascript" src="http://jscolor.com/jscolor/jscolor.js"></script>
<script>
function gerartitulo() {
 var tipo = document.getElementById("tipo").value;
 
switch(tipo) {
 case '[Avatar] ':
 tipob = 'Avatar';
 jQuery('input[name="f"]').val('8');
 break;
 case '[Assinatura] ':
 tipob = 'Assinatura';
  jQuery('input[name="f"]').val('8');
 break;
 case '[Userbar] ':
 tipob = 'Userbar';
  jQuery('input[name="f"]').val('8');
 break;
 case '[Banner] ':
 tipob = 'Banner';
  jQuery('input[name="f"]').val('9');
 break;

 tipob = 'Logo';
  jQuery('input[name="f"]').val('9');
 break;
 
case '[Botões] ':
case '[Ícones] ':
case '[Ranks] ':
jQuery('input[name="f"]').val('11');
 break;
 
case '[Outros] ':
case '[Imagem] ':
jQuery('input[name="f"]').val('12');
 break;
 }
 
 var cor = document.getElementById("cor").value;
 var tamanho = document.getElementById("tamanho").value;
 var texto = document.getElementById("texto").value;
 var textotonalidade = document.getElementById("textotonalidade").value;
 var cortonalidade = document.getElementById("cortonalidade").value;
 
jQuery("input[name=subject]").attr('value', tipo+cor+cortonalidade+tamanho+texto+textotonalidade);
 jQuery("#titlecode").html(tipo+cor+cortonalidade+tamanho+texto+textotonalidade);
 
if(tipo == "[Avatar] " || tipo == "[Assinatura] " || tipo == "[Userbar] " || tipo == "[Banner] " || tipo == "[Logo] ") {
 jQuery('#size_extra optgroup').css('display','block');
 jQuery('#size_extra optgroup[label!=' + tipob + ']').css('display','none');
 jQuery('#size_extra_span').css('display','block');
 }
 else {
 jQuery('#size_extra_span').css('display','none');
 }
}
imagensdopedido = '';
 
function gerarpedido() {
 gerartitulo();
 var cordofundo = document.getElementById("fundo").value;
 var cordafonte = document.getElementById("fontecor").value;
 var nomedafonte = (document.getElementById("fonte").value == '') ? document.getElementById("fonteNome").value : document.getElementById("fonte").value;
 var tipodeanimacao = (document.getElementById("animacao").value == '') ? document.getElementById("animacaoNome").value : document.getElementById("animacao").value;
 var tipodemoldura = (document.getElementById("moldura").value == '') ? document.getElementById("molduraNome").value : document.getElementById("moldura").value;
 var descricaodopedido = document.getElementById("adicionais").innerHTML;
 var descricaodopedido = document.getElementById("adicionais").value;
 var dimensaoA = document.getElementById("dimensoesA").value;
 var dimensaoL = document.getElementById("dimensoesL").value;
 
var dimensaof = (document.getElementById("size_extra").value == '') ? dimensaoA + ' x ' + dimensaoL + ' px' : document.getElementById("size_extra").value;
 
var urlforum = document.getElementById("urlforum").value;
 
finalmessage = '[b]Endereço do fórum :[/b] [url]'+ urlforum + '[/url]\n[b]Imagens a serem usadas :[/b] ' + imagensdopedido + '\n [b]Dimensões :[/b] ' + dimensaof +' \n[b]Cor do fundo :[/b] #' + cordofundo + '\n[b]Cor da fonte :[/b] #' + cordafonte + '\n[b]Fonte :[/b] ' + nomedafonte + '\n[b]Animação :[/b] ' + tipodeanimacao + '\n[b]Moldura :[/b] ' + tipodemoldura + '\n[b]Descrição do trabalho :[/b] ' + descricaodopedido;
 
 
jQuery("input[name=message]").attr('value', finalmessage);
}
 
function outra(id) {
 var inputID = id+"Nome";
 (document.getElementById(id).value == '') ? document.getElementById(inputID).style.display = 'inline' : document.getElementById(inputID).style.display = 'none';
 document.getElementById(inputID).focus();
}
 
 function removeimg(obj) {
 obj.parent().parent().remove();
 update_img();
 }
 function addimg() {
 $('#addimage').before('<tr class=image><td class=part></td><td><input style="float:left; display: inline; background-color: #ffffff;border: 1px solid #BCBCBC;color: #666666;padding: 2px;cursor: text;" type=text name=images onchange="update_img_list()" /> <div class="previsualise"></div> <div class="remove" onClick="removeimg($(this))"></div><div class="previsuimg"><div></div></div></td></tr>');
 $('#addimage').prev().find('.previsualise').hover(
 function () {
 $(this).parent().find('.previsuimg').html('<div><img src="'+encodeURI($(this).parent().find('input').attr('value'))+'" /></div>').find('div').css('display','block');
 },
 function () {
 $(this).parent().find('.previsuimg div').css('display','none');
 }
 );
 update_img();
 }
 function update_img() {
 if($('.image').length<2) $('.image .remove').hide();
 else $('.image .remove').show();
 update_img_list();
 }
 
function update_img_list() {
 imagensdopedido = '';
 jQuery('input[name=images]').each( function(index) {
if($(this).val() != '') {
 imagensdopedido = imagensdopedido + $(this).val() + ' ; ';
}
 });
 gerarpedido();
 }
 
gerartitulo();
gerarpedido();
 
</script>
 <h1 class="page-title">Formulário de pedidos gráficos</h1>
 <div class="panel row2"><div class="inner"><span class="corners-top"><span></span></span>
 <div class="h3" style="margin-top: 7px;">Sobre o formulário</div>
 <p style="font-size: 12px;">O presente formulário foi criado com o objetivo de promover uma maior organização dos pedidos feitos na seção gráfica deste fórum. Em cada uma das divisões abaixo poderá encontrar uma parte do código, a primeira caixa - "Informações gerais" - vale para o título e a segunda para o corpo da mensagem. Assim que tudo estiver feito, poderá enviar o pedido, que será postado automaticamente. Se necessitar de alguma modificação, poderá fazer editando a sua mensagem. Lembre-se somente que antes de fazer um pedido, é recomendado ver a <a href="http://mundonovo.cinebb.com/-t6.htm#7">Regras da seção de criações gráficas!</a>.
 
</p><span class="corners-bottom"><span></span></span>
 </div>
 </div>
 
 <div class="clear" style="height: 6px;"></div>
 
 
<div class="panel"><div class="inner"><span class="corners-top"><span></span></span><div class="h3" style="margin-top: 7px;">Informações gerais</div>
 
<form action="/posting.forum" method="post" enctype="multipart/form-data" id="fa_form" onSubmit="fa_cookie();">
 <fieldset class="fields1">
 
<dl><dt>
 <label>Tipo de pedido :</label></dt><dd><select id="tipo" tabindex="1" onChange="gerartitulo();" />
 <option value=""></option>
 <option value="[Avatar] ">Avatar</option>
 
 
<option value="[Assinatura] ">Assinatura</option>
 <option value="[Userbar] ">Userbar</option>
 <option value="[Banner] ">Banner</option>
 <option value="[Logo] ">Logo</option>
 <option value="[Botões] ">Botões</option>
 <option value="[Ícones] ">Ícones</option>
 
 <option value="[Menu] ">Menu de navegação</option>
 <option value="[Ranks] ">Ranks</option>
 <option value="[Outros] ">Outros</option>
 <option value="[Imagem] ">Imagem em geral</option>
 </select></dd></dl>
 
<dl><dt>
 <label>Cor geral :</label></dt><dd><select id="cor" tabindex="2" onChange="gerartitulo();" />
 
 <option value=" "></option>
 
<option value="Vermelho">Vermelho</option>
 <option value="Verde">Verde</option>
 <option value="Amarelo">Amarelo</option>
 <option value="Azul">Azul</option>
 <option value="Roxo">Roxo</option>
 
 <option value="Rosa">Rosa</option>
 
<option value="Laranja">Laranja</option>
 <option value="Branco">Branco</option>
 <option value="Preto">Preto</option>
 <option value="Cinza">Cinza</option>
 <option value="Marrom">Marrom</option>
 
 <option value="Transparente">Transparente</option>
 
<option value="">Nenhuma da lista</option></select> <select id="cortonalidade" onChange="gerartitulo();" />
 <option value=""></option>
 <option value="">Normal</option>
 <option value=" claro">Claro</option>
 <option value=" escuro">Escuro</option></select></dd></dl>
 
 
<dl><dt>
 <label>Tamanho geral :</label></dt><dd><select id="tamanho" tabindex="3" onChange="gerartitulo();" />
 
<option value=" "></option>
 <option value=" - Pequeno ">Pequeno</option>
 <option value=" - Médio ">Médio</option>
 <option value=" - Grande ">Grande</option></select></dd></dl>
 
<dl><dt>
 
 <label>Cor geral do texto :</label></dt><dd><select id="texto" tabindex="4" onChange="gerartitulo();" />
 <option value=" "></option>
 
<option value="- Texto vermelho ">Vermelho</option>
 <option value="- Texto verde ">Verde</option>
 <option value="- Texto amarelo ">Amarelo</option>
 <option value="- Texto azul ">Azul</option>
 
 <option value="- Texto roxo ">Roxo</option>
 <option value="- Texto rosa ">Rosa</option>
 
<option value="- Texto laranja ">Laranja</option>
 <option value="- Texto branco ">Branco</option>
 <option value="- Texto preto ">Preto</option>
 <option value="- Texto cinza ">Cinza</option>
 
 <option value="- Texto marrom ">Marrom</option>
 <option value="">Nenhuma da lista</option></select> <select id="textotonalidade" onChange="gerartitulo();" />
 
<option value=""></option>
 <option value="">Normal</option>
 <option value=" claro">Claro</option>
 <option value=" escuro">Escuro</option></select></dd></dl>
 
 
</fieldset>
 <span class="corners-bottom"><span></span></span></div></div>
 
<div class="clear" style="height: 6px;"></div>
 <div class="panel"><div class="inner"><span class="corners-top"><span></span></span>
 <div class="h3" style="margin-top: 7px;">Informações específicas</div>
 
<fieldset class="fields1">
 
<dl><dt>
 <label>Imagens a serem usadas :</label></dt>
 
 <dd>Indique o endereço da imagem a usar. Caso necessite de mais imagens, carregue em +, para que o endereço seja validado. Este irá desaparecer, e poderá então adicionar outro endereço.
 <table>
 <tr id="addimage">
 <td class="part"></td>
 <td>
 <div class="more" onClick="addimg()"></div>
 
</td>
 </tr>
 </table>
 
 
<script type="text/javascript">addimg()</script>
 
</dd></dl>
 <dl><dt>
 <label>Dimensões :</label></dt>
 <dd> <input class="inputbox" type="text" id="dimensoesL" tabindex="6" onChange="gerarpedido();" style="width: 30px; clear: both;" />
 
px (largura) X
 <input class="inputbox" type="text" id="dimensoesA" tabindex="7" onChange="gerarpedido();" style="width: 30px;" /> px (altura) </dd><dd> <span id="size_extra_span" style="display: none;"> Tamanhos padrões do tipo de pedido escolhido : <select id="size_extra">
 
 <option value=""></option>
 <optgroup label="Avatar">
 <option value="120 x 120 px">120 x 120 px</option>
 <option value="100 x 120 px">100 x 120 px</option>
 
<option value="120 x 160 px">120 x 160 px</option>
 <option value="140 x 180 px">140 x 180 px</option>
 <option value="140 x 200 px">140 x 200 px</option>
 
 <option value="150 x 180 px">150 x 180 px</option>
 <option value="150 x 200 px">150 x 200 px</option>
 </optgroup>
 
<optgroup label="Assinatura">
 <option value="400 x 120 px">400 x 120 px</option>
 <option value="400 x 150 px">400 x 150 px</option>
 <option value="450 x 150 px">450 x 150 px</option>
 
 </optgroup>
 <optgroup label="Userbar">
 <option value="350 x 19 px">350 x 19 px</option>
 
</optgroup>
 <optgroup label="Banner">
 <option value="70 x 30 px">70 x 30 px</option>
 <option value="90 x 15 px">90 x 15 px</option>
 
 <option value="120 x 60 px">120 x 60 px</option>
 <option value="150 x 50 px">150 x 50 px</option>
 <option value="468 x 60 px">468 x 60 px</option>
 
</optgroup>
 <optgroup label="Logo">
 <option value="600 x 200 px">600 x 200 px</option>
 <option value="750 x 200 px">750 x 200 px</option>
 
 <option value="800 x 220 px">800 x 220 px</option>
 <option value="150 x 50 px">830 x 200 px</option>
 </optgroup>
 
</select></span>
 </dd></dl>
 
<dl><dt>
 <label>Endreço do seu fórum :</label></dt>
 
 <dd>Lembre-se que se se não possuir um endereço válido, seu pedido será recusado!<br>
 <input class="inputbox" type="text" id="urlforum" tabindex="8" onChange="gerarpedido();" style="width: 300px; clear: both;" />
 </dd></dl>
 
 
<dl><dt>
 <label>Cor do fundo :</label></dt>
 
<dd>Código hexadecimal da cor que deverá ser usada :<br>
 <input type="text" tabindex="9" onChange="gerarpedido();" class="inputbox color champ" value="FFFFFF" id="fundo" name="couleur_fond" maxlength="7" onblur="this.style.borderColor='#FFFFFF'" onfocus="this.style.borderColor='#FFFFFF'" style="width: 70px; background: url('http://2img.net/i/fa/wysiwyg/color_swatch.png') no-repeat right;" />
 </dd></dl>
 
 
<dl><dt>
 <label>Cor da fonte :</label></dt>
 <dd>Código hexadecimal da cor que deverá ser usada :<br>
 <input type="text" tabindex="10" onChange="gerarpedido();" class="inputbox color champ" value="FFFFFF" id="fontecor" name="couleur_fond" maxlength="7" onblur="this.style.borderColor='#FFFFFF'" onfocus="this.style.borderColor='#FFFFFF'" style="width: 70px; background: url('http://2img.net/i/fa/wysiwyg/color_swatch.png') no-repeat right;" />
 </dd></dl>
 
<dl><dt>
 
<label>Fonte :</label></dt><dd><select id="fonte" tabindex="11" onChange="outra('fonte'); gerarpedido();" />
 <option value=" "></option>
 
 <option value="Arial" style="font-family: Arial;">Arial</option>
 <option value="Arial Black" style="font-family: Arial Black;">Arial Black</option>
 <option value="Comic Sans MS" style="font-family: Comic Sans MS;">Comic Sans MS</option>
 <option value="Courier New" style="font-family: Courier New;">Courier New</option>
 
<option value="Georgia" style="font-family: Georgia;">Georgia</option>
 <option value="Times New Roman" style="font-family: Times New Roman;">Times New Roman</option>
 
 <option value="Calibri" style="font-family: Calibri;">Calibri</option>
 <option value="Trebuchet MS" style="font-family: Trebuchet MS;">Trebuchet MS</option>
 <option value="Verdana" style="font-family: Verdana;">Verdana</option>
 <option value="Visitor TTK 2" style="font-family: Visitor TTK 2;">Visitor TTK 2 (usada em Userbars)</option>
 
<option value="">Outra</option>
 </select> <input id="fonteNome" style="display: none; width: 400px;" class="inputbox" value="Qual?" onclick="if (this.value == 'Qual?') this.value = '';" onblur="if (this.value == '') this.value = 'Qual?';" onChange="gerarpedido();" onfocus="if (this.value == 'Qual?') this.value = '';" onblur="if (this.value == '') this.value = 'Qual?';"></dd></dl>
 
 
<dl><dt>
 <label>Animação :</label></dt><dd><select id="animacao" tabindex="12" onChange="outra('animacao'); gerarpedido();" />
 <option value=" "></option>
 <option value="Não">Não</option>
 <option value="">Sim</option>
 
</select> <input id="animacaoNome" style="display: none; width: 400px;" class="inputbox" value="Como?" onclick="if (this.value == 'Como?') this.value = '';" onblur="if (this.value == '') this.value = 'Como?';" onChange="gerarpedido();" onfocus="if (this.value == 'Como?') this.value = '';" onblur="if (this.value == '') this.value = 'Como?';"></dd></dl>
 
<dl><dt>
 
 <label>Moldura :</label></dt><dd><select id="moldura" tabindex="13" onChange="outra('moldura'); gerarpedido();" />
 <option value=" "></option>
 <option value="Não">Não</option>
 <option value="">Sim</option>
 </select> <input id="molduraNome" style="display: none; width: 400px;" class="inputbox" value="Como?" onclick="if (this.value == 'Como?') this.value = '';" onblur="if (this.value == '') this.value = 'Como?';" onChange="gerarpedido();" onfocus="if (this.value == 'Como?') this.value = '';" onblur="if (this.value == '') this.value = 'Como?';" /></dd></dl>
 
<dl><dt>
 <label>Descrição do trabalho :</label></dt>
 
 <dd><textarea class="inputbox" id="adicionais" tabindex="14" onChange="gerarpedido();" style="clear: both; height: 100px; width: 500px;"></textarea></dd></dl>
 
</fieldset>
 
<input type="hidden" name="message" />
 <input type="hidden" name="subject" />
 <input type="hidden" name="mode" value="newtopic" />
 <input type="hidden" name="f" value="3" />
 <input type="hidden" name="lt" value="0" />
 
 
<span class="corners-bottom"><span></span></span></div></div>
 
 
<div class="panel"><div class="inner"><span class="corners-top"><span></span></span>
 <fieldset class="submit-buttons"><input value="Enviar seu pedido gráfico" type="submit" class="button1" name="post" /></fieldset>
 <span class="corners-bottom"><span></span></span></div>
</form>
<script>gerartitulo();</script>

Agora você devera ver este tutorial:

https://ajuda.forumeiros.com/-t32404.htm

Até mais!


EDIT:

Não é esse codigo, pois seu forum é invision, adaptei e é este abaixo:

<style>
.previsu {
background: url('https://sd-1.archive-host.com/membres/images/142586199450897653/LFD/vide.png');
border: 1px solid #1675BC;
display: none;
position: absolute;
top: 350px;
margin: auto;
margin-left: 150px !important;
}
.previsuimg {
position: relative;
}
.previsuimg div {
position: absolute; top: 30px; left: -10px; border: 3px double #E0E0E0; background: rgba(250, 250, 250, 0.9);
}


#addimage .part { background: url(https://2img.net/h/oi46.tinypic.com/2wrdc42.jpg) no-repeat -235px -600px; width: 60px; height: 20px;}
#addimage .more { background: url(https://2img.net/h/oi46.tinypic.com/2wrdc42.jpg) no-repeat 0px 2px; width: 12px; height: 20px; cursor:pointer;}
.image .part { background: url(https://2img.net/h/oi46.tinypic.com/2wrdc42.jpg) no-repeat -235px -548px; width: 60px; height: 20px;}
.image .remove { float: left;background: url(https://2img.net/h/oi46.tinypic.com/2wrdc42.jpg) no-repeat 0px -286px;padding-left: 16px;width: 12px; height: 20px; cursor:pointer;position: relative;top:3px;}
.image .previsualise { float: left;background: url(https://2img.net/h/oi46.tinypic.com/2wrdc42.jpg) no-repeat -50px -436px; margin-left: 5px; padding-left: 16px;width: 12px; height: 20px; cursor:pointer;position: relative;top:3px;}

.image { width: 300px; }

</style>
<script type="text/javascript" src="http://jscolor.com/jscolor/jscolor.js"></script>
<script>
function gerartitulo() {
var tipo = document.getElementById("tipo").value;
var cor = document.getElementById("cor").value;
var tamanho = document.getElementById("tamanho").value;
var texto = document.getElementById("texto").value;
var textotonalidade = document.getElementById("textotonalidade").value;
var cortonalidade = document.getElementById("cortonalidade").value;

jQuery("input[name=subject]").attr('value', tipo+cor+cortonalidade+tamanho+texto+textotonalidade);
jQuery("#titlecode").html(tipo+cor+cortonalidade+tamanho+texto+textotonalidade);

if(tipo == "[Avatar] " || tipo == "[Assinatura] " || tipo == "[Userbar] " || tipo == "[Banner] " || tipo == "[Logo] ") {
jQuery('#size_extra optgroup').css('display','block');
jQuery('#size_extra optgroup[label!=' + tipob + ']').css('display','none');
jQuery('#size_extra_span').css('display','block');
}
else {
jQuery('#size_extra_span').css('display','none');
}
}
imagensdopedido = '';

function gerarpedido() {
gerartitulo();
var cordofundo = document.getElementById("fundo").value;
var cordafonte = document.getElementById("fontecor").value;
var nomedafonte = (document.getElementById("fonte").value == '') ? document.getElementById("fonteNome").value : document.getElementById("fonte").value;
var tipodeanimacao = (document.getElementById("animacao").value == '') ? document.getElementById("animacaoNome").value : document.getElementById("animacao").value;
var tipodemoldura = (document.getElementById("moldura").value == '') ? document.getElementById("molduraNome").value : document.getElementById("moldura").value;
var descricaodopedido = document.getElementById("adicionais").innerHTML;
var descricaodopedido = document.getElementById("adicionais").value;
var dimensaoA = document.getElementById("dimensoesA").value;
var dimensaoL = document.getElementById("dimensoesL").value;

var dimensaof = (document.getElementById("size_extra").value == '') ? dimensaoA + ' x ' + dimensaoL + ' px' : document.getElementById("size_extra").value;

var urlforum = document.getElementById("urlforum").value;

finalmessage = 'Endereço do fórum : [url]'+ urlforum + '[/url]\nImagens a serem usadas : ' + imagensdopedido + '\n Dimensões : ' + dimensaof +' \nCor do fundo : #' + cordofundo + '\nCor da fonte : #' + cordafonte + '\nFonte : ' + nomedafonte + '\nAnimação : ' + tipodeanimacao + '\nMoldura : ' + tipodemoldura + '\nDescrição do trabalho : ' + descricaodopedido;


jQuery("input[name=message]").attr('value', finalmessage);
}

function outra(id) {
var inputID = id+"Nome";
(document.getElementById(id).value == '') ? document.getElementById(inputID).style.display = 'inline' : document.getElementById(inputID).style.display = 'none';
document.getElementById(inputID).focus();
}

function removeimg(obj) {
obj.parent().parent().remove();
update_img();
}
function addimg() {
$('#addimage').before('<tr class=image><td class=part></td><td><input style="float:left; display: inline; background-color: #ffffff;border: 1px solid #BCBCBC;color: #666666;padding: 2px;cursor: text;" type=text name=images onchange="update_img_list()" /> <div class="previsualise"></div> <div class="remove" onClick="removeimg($(this))"></div><div class="previsuimg"><div></div></div></td></tr>');
$('#addimage').prev().find('.previsualise').hover(
function () {
$(this).parent().find('.previsuimg').html('<div><img src="'+encodeURI($(this).parent().find('input').attr('value'))+'" /></div>').find('div').css('display','block');
},
function () {
$(this).parent().find('.previsuimg div').css('display','none');
}
);
update_img();
}
function update_img() {
if($('.image').length<2) $('.image .remove').hide();
else $('.image .remove').show();
update_img_list();
}

function update_img_list() {
imagensdopedido = '';
jQuery('input[name=images]').each( function(index) {
if($(this).val() != '') {
imagensdopedido = imagensdopedido + $(this).val() + ' ; ';
}
});
gerarpedido();
}

gerartitulo();
gerarpedido();

</script>
<h1 class="page-title">Formulário de pedidos gráficos</h1>
<div class="panel row2"><div class="inner"><span class="corners-top"><span></span></span>
<div class="h3" style="margin-top: 7px;">Sobre o formulário</div>
<p style="font-size: 12px;">O presente formulário foi criado com o objetivo de promover uma maior organização dos pedidos feitos na seção gráfica deste fórum. Em cada uma das divisões abaixo poderá encontrar uma parte do código, a primeira caixa - "Informações gerais" - vale para o título e a segunda para o corpo da mensagem. Assim que tudo estiver feito, poderá enviar o pedido, que será postado automaticamente. Se necessitar de alguma modificação, poderá fazer editando a sua mensagem. </a>.

</p><span class="corners-bottom"><span></span></span>
</div>
</div>

<div class="clear" style="height: 6px;"></div>


<div class="panel"><div class="inner"><span class="corners-top"><span></span></span><div class="h3" style="margin-top: 7px;">Informações gerais</div>

<form action="/post" method="post" enctype="multipart/form-data" id="fa_form" onSubmit="fa_cookie();">
<fieldset class="fields1">

<dl><dt>
<label>Tipo de pedido :</label></dt><dd><select id="tipo" tabindex="1" onChange="gerartitulo();" />
<option value=""></option>
<option value="[Avatar] ">Avatar</option>


<option value="[Sing]">Sing</option>
<option value="[UserBar] ">Userbar</option>
<option value="[Kit] ">Kit</option>
<option value="[Sprite] ">Sprite</option>
</select></dd></dl>

<dl><dt>
<label>Cor geral :</label></dt><dd><select id="cor" tabindex="2" onChange="gerartitulo();" />

<option value=" "></option>

<option value="Vermelho">Vermelho</option>
<option value="Verde">Verde</option>
<option value="Amarelo">Amarelo</option>
<option value="Azul">Azul</option>
<option value="Roxo">Roxo</option>

<option value="Rosa">Rosa</option>

<option value="Laranja">Laranja</option>
<option value="Branco">Branco</option>
<option value="Preto">Preto</option>
<option value="Cinza">Cinza</option>
<option value="Marrom">Marrom</option>

<option value="Transparente">Transparente</option>

<option value="">Nenhuma da lista</option></select> <select id="cortonalidade" onChange="gerartitulo();" />
<option value=""></option>
<option value="">Normal</option>
<option value=" claro">Claro</option>
<option value=" escuro">Escuro</option></select></dd></dl>


<dl><dt>
<label>Tamanho geral :</label></dt><dd><select id="tamanho" tabindex="3" onChange="gerartitulo();" />

<option value=" "></option>
<option value=" - Pequeno ">Pequeno</option>
<option value=" - Médio ">Médio</option>
<option value=" - Grande ">Grande</option></select></dd></dl>

<dl><dt>

<label>Cor geral do texto :</label></dt><dd><select id="texto" tabindex="4" onChange="gerartitulo();" />
<option value=" "></option>

<option value="- Texto vermelho ">Vermelho</option>
<option value="- Texto verde ">Verde</option>
<option value="- Texto amarelo ">Amarelo</option>
<option value="- Texto azul ">Azul</option>

<option value="- Texto roxo ">Roxo</option>
<option value="- Texto rosa ">Rosa</option>

<option value="- Texto laranja ">Laranja</option>
<option value="- Texto branco ">Branco</option>
<option value="- Texto preto ">Preto</option>
<option value="- Texto cinza ">Cinza</option>

<option value="- Texto marrom ">Marrom</option>
<option value="">Nenhuma da lista</option></select> <select id="textotonalidade" onChange="gerartitulo();" />

<option value=""></option>
<option value="">Normal</option>
<option value=" claro">Claro</option>
<option value=" escuro">Escuro</option></select></dd></dl>


</fieldset>
<span class="corners-bottom"><span></span></span></div></div>

<div class="clear" style="height: 6px;"></div>
<div class="panel"><div class="inner"><span class="corners-top"><span></span></span>
<div class="h3" style="margin-top: 7px;">Informações específicas</div>

<fieldset class="fields1">

<dl><dt>
<label>Imagens a serem usadas :</label></dt>

<dd>Indique o endereço da imagem a usar. Caso necessite de mais imagens, carregue em +, para que o endereço seja validado. Este irá desaparecer, e poderá então adicionar outro endereço.
<table>
<tr id="addimage">
<td class="part"></td>
<td>
<div class="more" onClick="addimg()"></div>

</td>
</tr>
</table>


<script type="text/javascript">addimg()</script>

</dd></dl>
<dl><dt>
<label>Dimensões :</label></dt>
<dd> <input class="inputbox" type="text" id="dimensoesL" tabindex="6" onChange="gerarpedido();" style="width: 30px; clear: both;" />

px (largura) X
<input class="inputbox" type="text" id="dimensoesA" tabindex="7" onChange="gerarpedido();" style="width: 30px;" /> px (altura) </dd><dd> <span id="size_extra_span" style="display: none;"> Tamanhos padrões do tipo de pedido escolhido : <select id="size_extra">

<option value=""></option>
<optgroup label="Avatar">
<option value="120 x 120 px">120 x 120 px</option>
<option value="100 x 120 px">100 x 120 px</option>

<option value="120 x 160 px">120 x 160 px</option>
<option value="140 x 180 px">140 x 180 px</option>
<option value="140 x 200 px">140 x 200 px</option>

<option value="150 x 180 px">150 x 180 px</option>
<option value="150 x 200 px">150 x 200 px</option>
</optgroup>

<optgroup label="Assinatura">
<option value="400 x 120 px">400 x 120 px</option>
<option value="400 x 150 px">400 x 150 px</option>
<option value="450 x 150 px">450 x 150 px</option>

</optgroup>
<optgroup label="Userbar">
<option value="350 x 19 px">350 x 19 px</option>

</optgroup>
<optgroup label="Banner">
<option value="70 x 30 px">70 x 30 px</option>
<option value="90 x 15 px">90 x 15 px</option>

<option value="120 x 60 px">120 x 60 px</option>
<option value="150 x 50 px">150 x 50 px</option>
<option value="468 x 60 px">468 x 60 px</option>

</optgroup>
<optgroup label="Logo">
<option value="600 x 200 px">600 x 200 px</option>
<option value="750 x 200 px">750 x 200 px</option>

<option value="800 x 220 px">800 x 220 px</option>
<option value="150 x 50 px">830 x 200 px</option>
</optgroup>

</select></span>
</dd></dl>

<dl><dt>
<label>Endreço do seu fórum :</label></dt>

<dd>Lembre-se que se se não possuir um endereço válido, seu pedido será recusado!<br>
<input class="inputbox" type="text" id="urlforum" tabindex="8" onChange="gerarpedido();" style="width: 300px; clear: both;" />
</dd></dl>


<dl><dt>
<label>Cor do fundo :</label></dt>

<dd>Código hexadecimal da cor que deverá ser usada :<br>
<input type="text" tabindex="9" onChange="gerarpedido();" class="inputbox color champ" value="FFFFFF" id="fundo" name="couleur_fond" maxlength="7" onblur="this.style.borderColor='#FFFFFF'" onfocus="this.style.borderColor='#FFFFFF'" style="width: 70px; background: url('https://2img.net/i/fa/wysiwyg/color_swatch.png') no-repeat right;" />
</dd></dl>


<dl><dt>
<label>Cor da fonte :</label></dt>
<dd>Código hexadecimal da cor que deverá ser usada :<br>
<input type="text" tabindex="10" onChange="gerarpedido();" class="inputbox color champ" value="FFFFFF" id="fontecor" name="couleur_fond" maxlength="7" onblur="this.style.borderColor='#FFFFFF'" onfocus="this.style.borderColor='#FFFFFF'" style="width: 70px; background: url('https://2img.net/i/fa/wysiwyg/color_swatch.png') no-repeat right;" />
</dd></dl>

<dl><dt>

<label>Fonte :</label></dt><dd><select id="fonte" tabindex="11" onChange="outra('fonte'); gerarpedido();" />
<option value=" "></option>

<option value="Arial" style="font-family: Arial;">Arial</option>
<option value="Arial Black" style="font-family: Arial Black;">Arial Black</option>
<option value="Comic Sans MS" style="font-family: Comic Sans MS;">Comic Sans MS</option>
<option value="Courier New" style="font-family: Courier New;">Courier New</option>

<option value="Georgia" style="font-family: Georgia;">Georgia</option>
<option value="Times New Roman" style="font-family: Times New Roman;">Times New Roman</option>

<option value="Calibri" style="font-family: Calibri;">Calibri</option>
<option value="Trebuchet MS" style="font-family: Trebuchet MS;">Trebuchet MS</option>
<option value="Verdana" style="font-family: Verdana;">Verdana</option>
<option value="Visitor TTK 2" style="font-family: Visitor TTK 2;">Visitor TTK 2 (usada em Userbars)</option>

<option value="">Outra</option>
</select> <input id="fonteNome" style="display: none; width: 400px;" class="inputbox" value="Qual?" onclick="if (this.value == 'Qual?') this.value = '';" onblur="if (this.value == '') this.value = 'Qual?';" onChange="gerarpedido();" onfocus="if (this.value == 'Qual?') this.value = '';" onblur="if (this.value == '') this.value = 'Qual?';"></dd></dl>


<dl><dt>
<label>Animação :</label></dt><dd><select id="animacao" tabindex="12" onChange="outra('animacao'); gerarpedido();" />
<option value=" "></option>
<option value="Não">Não</option>
<option value="">Sim</option>

</select> <input id="animacaoNome" style="display: none; width: 400px;" class="inputbox" value="Como?" onclick="if (this.value == 'Como?') this.value = '';" onblur="if (this.value == '') this.value = 'Como?';" onChange="gerarpedido();" onfocus="if (this.value == 'Como?') this.value = '';" onblur="if (this.value == '') this.value = 'Como?';"></dd></dl>

<dl><dt>

<label>Moldura :</label></dt><dd><select id="moldura" tabindex="13" onChange="outra('moldura'); gerarpedido();" />
<option value=" "></option>
<option value="Não">Não</option>
<option value="">Sim</option>
</select> <input id="molduraNome" style="display: none; width: 400px;" class="inputbox" value="Como?" onclick="if (this.value == 'Como?') this.value = '';" onblur="if (this.value == '') this.value = 'Como?';" onChange="gerarpedido();" onfocus="if (this.value == 'Como?') this.value = '';" onblur="if (this.value == '') this.value = 'Como?';" /></dd></dl>

<dl><dt>
<label>Descrição do trabalho :</label></dt>

<dd><textarea class="inputbox" id="adicionais" tabindex="14" onChange="gerarpedido();" style="clear: both; height: 100px; width: 500px;"></textarea></dd></dl>

</fieldset>

<input type="hidden" name="message" />
<input type="hidden" name="subject" />
<input type="hidden" name="mode" value="newtopic" />
<input type="hidden" name="f" value="29" />
<input type="hidden" name="lt" value="0" />


<span class="corners-bottom"><span></span></span></div></div>


<div class="panel"><div class="inner"><span class="corners-top"><span></span></span>
<fieldset class="submit-buttons"><input value="Enviar seu pedido gráfico" type="submit" class="button1" name="post" /></fieldset>
<span class="corners-bottom"><span></span></span></div>
</form>
<script>gerartitulo();</script>

só mude esta area: <input type="hidden" name="f" value="29" />

em vermelho você muda para onde quer que ele seja postado!

Uma pergunta ao pessoal da staff, eu fiz certo o form?
muryllodantas
muryllodantas
Membro

Membro desde : 31/10/2010
Mensagens : 760
Pontos : 1013

http://rendersdesigner.forumeiro.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Personalizar o botão "novo tópico" - fórmulário

Mensagem por Cristian 95 31.12.10 19:00

Po veio.. até que agora foi em.. apareceu lá as opções, eu preenchi e blá blá.. mais quando cliquei em "enviar formulario".. ele deu isso
Personalizar o botão "novo tópico" - fórmulário Imagembjw
Cristian 95
Cristian 95
Membro

Membro desde : 16/12/2010
Mensagens : 946
Pontos : 1278

http://secondlifevirtual.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Personalizar o botão "novo tópico" - fórmulário

Mensagem por Cream 31.12.10 20:04

Olá,

Para uma melhor resolução do problema:
Passe o link da página criada com o formulário.
Passe o link da página criada com o script.

Grato!
Cream
Cream
Membro Entusiasta

Membro desde : 15/12/2010
Mensagens : 8540
Pontos : 11644

https://ajuda.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Personalizar o botão "novo tópico" - fórmulário

Mensagem por Cristian 95 31.12.10 20:24

Cristian 95
Cristian 95
Membro

Membro desde : 16/12/2010
Mensagens : 946
Pontos : 1278

http://secondlifevirtual.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Personalizar o botão "novo tópico" - fórmulário

Mensagem por muryllodantas 01.01.11 18:34

Olá novamente!

Nós queremos as duas paginas HTML criadas por ti!

Ate mais
muryllodantas
muryllodantas
Membro

Membro desde : 31/10/2010
Mensagens : 760
Pontos : 1013

http://rendersdesigner.forumeiro.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Personalizar o botão "novo tópico" - fórmulário

Mensagem por Cristian 95 01.01.11 20:15

Bom eu fui em Modulos :seta2: HTML :seta2: Gestão das páginas HTML. e "criei uma nova" HTML com esse código.
Código:
<style>
.previsu {
background: url('http://sd-1.archive-host.com/membres/images/142586199450897653/LFD/vide.png');
border: 1px solid #1675BC;
display: none;
position: absolute;
top: 350px;
margin: auto;
margin-left: 150px !important;
}
.previsuimg {
position: relative;
}
.previsuimg div {
position: absolute; top: 30px; left: -10px; border: 3px double #E0E0E0; background: rgba(250, 250, 250, 0.9);
}


#addimage .part { background: url(http://i46.tinypic.com/2wrdc42.jpg) no-repeat -235px -600px; width: 60px; height: 20px;}
#addimage .more { background: url(http://i46.tinypic.com/2wrdc42.jpg) no-repeat 0px 2px; width: 12px; height: 20px; cursor:pointer;}
.image .part { background: url(http://i46.tinypic.com/2wrdc42.jpg) no-repeat -235px -548px; width: 60px; height: 20px;}
.image .remove { float: left;background: url(http://i46.tinypic.com/2wrdc42.jpg) no-repeat 0px -286px;padding-left: 16px;width: 12px; height: 20px; cursor:pointer;position: relative;top:3px;}
.image .previsualise { float: left;background: url(http://i46.tinypic.com/2wrdc42.jpg) no-repeat -50px -436px; margin-left: 5px; padding-left: 16px;width: 12px; height: 20px; cursor:pointer;position: relative;top:3px;}

.image { width: 300px; }

</style>
<script type="text/javascript" src="http://jscolor.com/jscolor/jscolor.js"></script>
<script>
function gerartitulo() {
var tipo = document.getElementById("tipo").value;
var cor = document.getElementById("cor").value;
var tamanho = document.getElementById("tamanho").value;
var texto = document.getElementById("texto").value;
var textotonalidade = document.getElementById("textotonalidade").value;
var cortonalidade = document.getElementById("cortonalidade").value;

jQuery("input[name=subject]").attr('value', tipo+cor+cortonalidade+tamanho+texto+textotonalidade);
jQuery("#titlecode").html(tipo+cor+cortonalidade+tamanho+texto+textotonalidade);

if(tipo == "[Avatar] " || tipo == "[Assinatura] " || tipo == "[Userbar] " || tipo == "[Banner] " || tipo == "[Logo] ") {
jQuery('#size_extra optgroup').css('display','block');
jQuery('#size_extra optgroup[label!=' + tipob + ']').css('display','none');
jQuery('#size_extra_span').css('display','block');
}
else {
jQuery('#size_extra_span').css('display','none');
}
}
imagensdopedido = '';

function gerarpedido() {
gerartitulo();
var cordofundo = document.getElementById("fundo").value;
var cordafonte = document.getElementById("fontecor").value;
var nomedafonte = (document.getElementById("fonte").value == '') ? document.getElementById("fonteNome").value : document.getElementById("fonte").value;
var tipodeanimacao = (document.getElementById("animacao").value == '') ? document.getElementById("animacaoNome").value : document.getElementById("animacao").value;
var tipodemoldura = (document.getElementById("moldura").value == '') ? document.getElementById("molduraNome").value : document.getElementById("moldura").value;
var descricaodopedido = document.getElementById("adicionais").innerHTML;
var descricaodopedido = document.getElementById("adicionais").value;
var dimensaoA = document.getElementById("dimensoesA").value;
var dimensaoL = document.getElementById("dimensoesL").value;

var dimensaof = (document.getElementById("size_extra").value == '') ? dimensaoA + ' x ' + dimensaoL + ' px' : document.getElementById("size_extra").value;

var urlforum = document.getElementById("urlforum").value;

finalmessage = 'Endereço do fórum : [url]'+ urlforum + '[/url]\nImagens a serem usadas : ' + imagensdopedido + '\n Dimensões : ' + dimensaof +' \nCor do fundo : #' + cordofundo + '\nCor da fonte : #' + cordafonte + '\nFonte : ' + nomedafonte + '\nAnimação : ' + tipodeanimacao + '\nMoldura : ' + tipodemoldura + '\nDescrição do trabalho : ' + descricaodopedido;


jQuery("input[name=message]").attr('value', finalmessage);
}

function outra(id) {
var inputID = id+"Nome";
(document.getElementById(id).value == '') ? document.getElementById(inputID).style.display = 'inline' : document.getElementById(inputID).style.display = 'none';
document.getElementById(inputID).focus();
}

function removeimg(obj) {
obj.parent().parent().remove();
update_img();
}
function addimg() {
$('#addimage').before('<tr class=image><td class=part></td><td><input style="float:left; display: inline; background-color: #ffffff;border: 1px solid #BCBCBC;color: #666666;padding: 2px;cursor: text;" type=text name=images onchange="update_img_list()" /> <div class="previsualise"></div> <div class="remove" onClick="removeimg($(this))"></div><div class="previsuimg"><div></div></div></td></tr>');
$('#addimage').prev().find('.previsualise').hover(
function () {
$(this).parent().find('.previsuimg').html('<div><img src="'+encodeURI($(this).parent().find('input').attr('value'))+'" /></div>').find('div').css('display','block');
},
function () {
$(this).parent().find('.previsuimg div').css('display','none');
}
);
update_img();
}
function update_img() {
if($('.image').length<2) $('.image .remove').hide();
else $('.image .remove').show();
update_img_list();
}

function update_img_list() {
imagensdopedido = '';
jQuery('input[name=images]').each( function(index) {
if($(this).val() != '') {
imagensdopedido = imagensdopedido + $(this).val() + ' ; ';
}
});
gerarpedido();
}

gerartitulo();
gerarpedido();

</script>
<h1 class="page-title">Pedidos de Designer. Avatar, Sing, UserBar, Plano de Fundo ou até mesmo um Kit.. </h1><div class="panel row2"><div class="inner"><span class="corners-top"><span></span></span><div class="h3" style="margin-top: 7px;">Sobre o formulário</div>
<p style="font-size: 12px;">O presente formulário foi criado com o objetivo de promover uma maior organização dos pedidos feitos na seção gráfica deste fórum. Em cada uma das divisões abaixo poderá encontrar uma parte do código, a primeira caixa - "Informações gerais" - vale para o título e a segunda para o corpo da mensagem. Assim que tudo estiver feito, poderá enviar o pedido, que será postado automaticamente. Se necessitar de alguma modificação, poderá fazer editando a sua mensagem. </a>.

</p><span class="corners-bottom"><span></span></span>
</div>
</div>
<div class="clear" style="height: 6px;"></div>

<div class="panel"><div class="inner"><span class="corners-top"><span></span></span><div class="h3" style="margin-top: 7px;">Informações gerais</div>

<form action="/post" method="post" enctype="multipart/form-data" id="fa_form" onSubmit="fa_cookie();">
<fieldset class="fields1">

<dl><dt>
<label>Tipo de pedido :</label></dt><dd><select id="tipo" tabindex="1" onChange="gerartitulo();" />
<option value=""></option>
<option value="[Avatar] ">Avatar</option>
<option value="[Sing]">Sing</option>
<option value="[UserBar] ">Userbar</option>
<option value="[Plano de Fundo] ">Plano de Fundo</option>
<option value="[Kit] ">Kit</option>
</select></dd></dl>

<dl><dt>
<label>Cor geral :</label></dt><dd><select id="cor" tabindex="2" onChange="gerartitulo();" />

<option value=" "></option>

<option value="Vermelho">Vermelho</option>
<option value="Verde">Verde</option>
<option value="Amarelo">Amarelo</option>
<option value="Azul">Azul</option>
<option value="Roxo">Roxo</option>

<option value="Rosa">Rosa</option>

<option value="Laranja">Laranja</option>
<option value="Branco">Branco</option>
<option value="Preto">Preto</option>
<option value="Cinza">Cinza</option>
<option value="Marrom">Marrom</option>

<option value="Transparente">Transparente</option>

<option value="">Nenhuma da lista</option></select> <select id="cortonalidade" onChange="gerartitulo();" />
<option value=""></option>
<option value="">Normal</option>
<option value=" claro">Claro</option>
<option value=" escuro">Escuro</option></select></dd></dl>


<dl><dt>
<label>Tamanho geral :</label></dt><dd><select id="tamanho" tabindex="3" onChange="gerartitulo();" />

<option value=" "></option>
<option value=" - Pequeno ">Pequeno</option>
<option value=" - Médio ">Médio</option>
<option value=" - Grande ">Grande</option></select></dd></dl>

<dl><dt>

<label>Cor geral do texto :</label></dt><dd><select id="texto" tabindex="4" onChange="gerartitulo();" />
<option value=" "></option>

<option value="- Texto vermelho ">Vermelho</option>
<option value="- Texto verde ">Verde</option>
<option value="- Texto amarelo ">Amarelo</option>
<option value="- Texto azul ">Azul</option>

<option value="- Texto roxo ">Roxo</option>
<option value="- Texto rosa ">Rosa</option>

<option value="- Texto laranja ">Laranja</option>
<option value="- Texto branco ">Branco</option>
<option value="- Texto preto ">Preto</option>
<option value="- Texto cinza ">Cinza</option>

<option value="- Texto marrom ">Marrom</option>
<option value="">Nenhuma da lista</option></select> <select id="textotonalidade" onChange="gerartitulo();" />

<option value=""></option>
<option value="">Normal</option>
<option value=" claro">Claro</option>
<option value=" escuro">Escuro</option></select></dd></dl>


</fieldset>
<span class="corners-bottom"><span></span></span></div></div>
<div class="clear" style="height: 6px;"></div><div class="panel"><div class="inner"><span class="corners-top"><span></span></span><div class="h3" style="margin-top: 7px;">Informações específicas</div>

<fieldset class="fields1">

<dl><dt>
<label>Imagens a serem usadas :</label></dt>

<dd>Indique o endereço da imagem a usar. Caso necessite de mais imagens, carregue em +, para que o endereço seja validado. Este irá desaparecer, e poderá então adicionar outro endereço.
<table>
<tr id="addimage">
<td class="part"></td>
<td><div class="more" onClick="addimg()"></div>

</td>
</tr>
</table>


<script type="text/javascript">addimg()</script>

</dd></dl>
<dl><dt>
<label>Dimensões :</label></dt>
<dd> <input class="inputbox" type="text" id="dimensoesL" tabindex="6" onChange="gerarpedido();" style="width: 30px; clear: both;" />

px (largura) X
<input class="inputbox" type="text" id="dimensoesA" tabindex="7" onChange="gerarpedido();" style="width: 30px;" /> px (altura) </dd><dd> <span id="size_extra_span" style="display: none;"> Tamanhos padrões do tipo de pedido escolhido : <select id="size_extra">

<option value=""></option>
<optgroup label="Avatar">
<option value="120 x 120 px">120 x 120 px</option>
<option value="100 x 120 px">100 x 120 px</option>

<option value="120 x 160 px">120 x 160 px</option>
<option value="140 x 180 px">140 x 180 px</option>
<option value="140 x 200 px">140 x 200 px</option>

<option value="150 x 180 px">150 x 180 px</option>
<option value="150 x 200 px">150 x 200 px</option>
</optgroup>

<optgroup label="Assinatura">
<option value="400 x 120 px">400 x 120 px</option>
<option value="400 x 150 px">400 x 150 px</option>
<option value="450 x 150 px">450 x 150 px</option>

</optgroup>
<optgroup label="Userbar">
<option value="350 x 19 px">350 x 19 px</option>

</optgroup>
<optgroup label="Banner">
<option value="70 x 30 px">70 x 30 px</option>
<option value="90 x 15 px">90 x 15 px</option>

<option value="120 x 60 px">120 x 60 px</option>
<option value="150 x 50 px">150 x 50 px</option>
<option value="468 x 60 px">468 x 60 px</option>

</optgroup>
<optgroup label="Logo">
<option value="600 x 200 px">600 x 200 px</option>
<option value="750 x 200 px">750 x 200 px</option>

<option value="800 x 220 px">800 x 220 px</option>
<option value="150 x 50 px">830 x 200 px</option>
</optgroup>

</select></span>
</dd></dl>


<dl><dt>
<label>Cor do fundo :</label></dt>

<dd>Código hexadecimal da cor que deverá ser usada :<br>
<input type="text" tabindex="9" onChange="gerarpedido();" class="inputbox color champ" value="FFFFFF" id="fundo" name="couleur_fond" maxlength="7" onblur="this.style.borderColor='#FFFFFF'" onfocus="this.style.borderColor='#FFFFFF'" style="width: 70px; background: url('http://2img.net/i/fa/wysiwyg/color_swatch.png') no-repeat right;" />
</dd></dl>


<dl><dt>
<label>Cor da fonte :</label></dt>
<dd>Código hexadecimal da cor que deverá ser usada :<br>
<input type="text" tabindex="10" onChange="gerarpedido();" class="inputbox color champ" value="FFFFFF" id="fontecor" name="couleur_fond" maxlength="7" onblur="this.style.borderColor='#FFFFFF'" onfocus="this.style.borderColor='#FFFFFF'" style="width: 70px; background: url('http://2img.net/i/fa/wysiwyg/color_swatch.png') no-repeat right;" />
</dd></dl>

<dl><dt>

<label>Fonte :</label></dt><dd><select id="fonte" tabindex="11" onChange="outra('fonte'); gerarpedido();" />
<option value=" "></option>

<option value="Arial" style="font-family: Arial;">Arial</option>
<option value="Arial Black" style="font-family: Arial Black;">Arial Black</option>
<option value="Comic Sans MS" style="font-family: Comic Sans MS;">Comic Sans MS</option>
<option value="Courier New" style="font-family: Courier New;">Courier New</option>

<option value="Georgia" style="font-family: Georgia;">Georgia</option>
<option value="Times New Roman" style="font-family: Times New Roman;">Times New Roman</option>

<option value="Calibri" style="font-family: Calibri;">Calibri</option>
<option value="Trebuchet MS" style="font-family: Trebuchet MS;">Trebuchet MS</option>
<option value="Verdana" style="font-family: Verdana;">Verdana</option>
<option value="Visitor TTK 2" style="font-family: Visitor TTK 2;">Visitor TTK 2 (usada em Userbars)</option>

<option value="">Outra</option>
</select> <input id="fonteNome" style="display: none; width: 400px;" class="inputbox" value="Qual?" onclick="if (this.value == 'Qual?') this.value = '';" onblur="if (this.value == '') this.value = 'Qual?';" onChange="gerarpedido();" onfocus="if (this.value == 'Qual?') this.value = '';" onblur="if (this.value == '') this.value = 'Qual?';"></dd></dl>


<dl><dt>
<label>Animação :</label></dt><dd><select id="animacao" tabindex="12" onChange="outra('animacao'); gerarpedido();" />
<option value=" "></option>
<option value="Não">Não</option>
<option value="">Sim</option>

</select> <input id="animacaoNome" style="display: none; width: 400px;" class="inputbox" value="Como?" onclick="if (this.value == 'Como?') this.value = '';" onblur="if (this.value == '') this.value = 'Como?';" onChange="gerarpedido();" onfocus="if (this.value == 'Como?') this.value = '';" onblur="if (this.value == '') this.value = 'Como?';"></dd></dl>

<dl><dt>

<label>Moldura :</label></dt><dd><select id="moldura" tabindex="13" onChange="outra('moldura'); gerarpedido();" />
<option value=" "></option>
<option value="Não">Não</option>
<option value="">Sim</option>
</select> <input id="molduraNome" style="display: none; width: 400px;" class="inputbox" value="Como?" onclick="if (this.value == 'Como?') this.value = '';" onblur="if (this.value == '') this.value = 'Como?';" onChange="gerarpedido();" onfocus="if (this.value == 'Como?') this.value = '';" onblur="if (this.value == '') this.value = 'Como?';" /></dd></dl>

<dl><dt>
<label>Descrição do trabalho :</label></dt>

<dd><textarea class="inputbox" id="adicionais" tabindex="14" onChange="gerarpedido();" style="clear: both; height: 100px; width: 500px;"></textarea></dd></dl>

</fieldset>

<input type="hidden" name="message" />
<input type="hidden" name="subject" />
<input type="hidden" name="mode" value="newtopic" />
<input type="hidden" name="f" value="29" />
<input type="hidden" name="lt" value="0" />



<span class="corners-bottom"><span></span></span></div></div>

<div class="panel"><div class="inner"><span class="corners-top"><span></span></span>
<fieldset class="submit-buttons"><input value="Enviar seu pedido gráfico" type="submit" class="button1" name="post" /></fieldset>
<span class="corners-bottom"><span></span></span></div>
</form>
<script>gerartitulo();</script>

<input type="hidden" name="f1" value="59" />
e o titulo "Designer", o link fico assim http://brasilplayerextreme.forumeiros.com/h1-designer. id 1.
depois criei outra com o código
Spoiler:
com o titulo Designer JS. e fico o link http://brasilplayerextreme.forumeiros.com/h2-designer-js. e o id 2.

em seguida copiei esse link "http://brasilplayerextreme.forumeiros.com/h2-designer-js" e fui em Geral :seta2: fórum :seta2: configuração :seta2: descrição e coloquei isso <script src=-h2.htm></script>.
Cristian 95
Cristian 95
Membro

Membro desde : 16/12/2010
Mensagens : 946
Pontos : 1278

http://secondlifevirtual.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Personalizar o botão "novo tópico" - fórmulário

Mensagem por muryllodantas 01.01.11 20:24

Tente colocar isto na descrição

<script src=/-h2.htm></script>

e adaptei o seu form denovo

Código:
<style>
.previsu {
background: url('http://sd-1.archive-host.com/membres/images/142586199450897653/LFD/vide.png');
border: 1px solid #1675BC;
display: none;
position: absolute;
top: 350px;
margin: auto;
margin-left: 150px !important;
}
.previsuimg {
position: relative;
}
.previsuimg div {
position: absolute; top: 30px; left: -10px; border: 3px double #E0E0E0; background: rgba(250, 250, 250, 0.9);
}


#addimage .part { background: url(http://i46.tinypic.com/2wrdc42.jpg) no-repeat -235px -600px; width: 60px; height: 20px;}
#addimage .more { background: url(http://i46.tinypic.com/2wrdc42.jpg) no-repeat 0px 2px; width: 12px; height: 20px; cursor:pointer;}
.image .part { background: url(http://i46.tinypic.com/2wrdc42.jpg) no-repeat -235px -548px; width: 60px; height: 20px;}
.image .remove { float: left;background: url(http://i46.tinypic.com/2wrdc42.jpg) no-repeat 0px -286px;padding-left: 16px;width: 12px; height: 20px; cursor:pointer;position: relative;top:3px;}
.image .previsualise { float: left;background: url(http://i46.tinypic.com/2wrdc42.jpg) no-repeat -50px -436px; margin-left: 5px; padding-left: 16px;width: 12px; height: 20px; cursor:pointer;position: relative;top:3px;}

.image { width: 300px; }

</style>
<script type="text/javascript" src="http://jscolor.com/jscolor/jscolor.js"></script>
<script>
function gerartitulo() {
var tipo = document.getElementById("tipo").value;
var cor = document.getElementById("cor").value;
var tamanho = document.getElementById("tamanho").value;
var texto = document.getElementById("texto").value;
var textotonalidade = document.getElementById("textotonalidade").value;
var cortonalidade = document.getElementById("cortonalidade").value;

jQuery("input[name=subject]").attr('value', tipo+cor+cortonalidade+tamanho+texto+textotonalidade);
jQuery("#titlecode").html(tipo+cor+cortonalidade+tamanho+texto+textotonalidade);

if(tipo == "[Avatar] " || tipo == "[Assinatura] " || tipo == "[Userbar] " || tipo == "[Banner] " || tipo == "[Logo] ") {
jQuery('#size_extra optgroup').css('display','block');
jQuery('#size_extra optgroup[label!=' + tipob + ']').css('display','none');
jQuery('#size_extra_span').css('display','block');
}
else {
jQuery('#size_extra_span').css('display','none');
}
}
imagensdopedido = '';

function gerarpedido() {
gerartitulo();
var cordofundo = document.getElementById("fundo").value;
var cordafonte = document.getElementById("fontecor").value;
var nomedafonte = (document.getElementById("fonte").value == '') ? document.getElementById("fonteNome").value : document.getElementById("fonte").value;
var tipodeanimacao = (document.getElementById("animacao").value == '') ? document.getElementById("animacaoNome").value : document.getElementById("animacao").value;
var tipodemoldura = (document.getElementById("moldura").value == '') ? document.getElementById("molduraNome").value : document.getElementById("moldura").value;
var descricaodopedido = document.getElementById("adicionais").innerHTML;
var descricaodopedido = document.getElementById("adicionais").value;
var dimensaoA = document.getElementById("dimensoesA").value;
var dimensaoL = document.getElementById("dimensoesL").value;

var dimensaof = (document.getElementById("size_extra").value == '') ? dimensaoA + ' x ' + dimensaoL + ' px' : document.getElementById("size_extra").value;

var urlforum = document.getElementById("urlforum").value;

finalmessage = 'Endereço do fórum : [url]'+ urlforum + '[/url]\nImagens a serem usadas : ' + imagensdopedido + '\n Dimensões : ' + dimensaof +' \nCor do fundo : #' + cordofundo + '\nCor da fonte : #' + cordafonte + '\nFonte : ' + nomedafonte + '\nAnimação : ' + tipodeanimacao + '\nMoldura : ' + tipodemoldura + '\nDescrição do trabalho : ' + descricaodopedido;


jQuery("input[name=message]").attr('value', finalmessage);
}

function outra(id) {
var inputID = id+"Nome";
(document.getElementById(id).value == '') ? document.getElementById(inputID).style.display = 'inline' : document.getElementById(inputID).style.display = 'none';
document.getElementById(inputID).focus();
}

function removeimg(obj) {
obj.parent().parent().remove();
update_img();
}
function addimg() {
$('#addimage').before('<tr class=image><td class=part></td><td><input style="float:left; display: inline; background-color: #ffffff;border: 1px solid #BCBCBC;color: #666666;padding: 2px;cursor: text;" type=text name=images onchange="update_img_list()" /> <div class="previsualise"></div> <div class="remove" onClick="removeimg($(this))"></div><div class="previsuimg"><div></div></div></td></tr>');
$('#addimage').prev().find('.previsualise').hover(
function () {
$(this).parent().find('.previsuimg').html('<div><img src="'+encodeURI($(this).parent().find('input').attr('value'))+'" /></div>').find('div').css('display','block');
},
function () {
$(this).parent().find('.previsuimg div').css('display','none');
}
);
update_img();
}
function update_img() {
if($('.image').length<2) $('.image .remove').hide();
else $('.image .remove').show();
update_img_list();
}

function update_img_list() {
imagensdopedido = '';
jQuery('input[name=images]').each( function(index) {
if($(this).val() != '') {
imagensdopedido = imagensdopedido + $(this).val() + ' ; ';
}
});
gerarpedido();
}

gerartitulo();
gerarpedido();

</script>
<h1 class="page-title">Pedidos de Designer. Avatar, Sing, UserBar, Plano de Fundo ou até mesmo um Kit.. </h1><div class="panel row2"><div class="inner"><span class="corners-top"><span></span></span><div class="h3" style="margin-top: 7px;">Sobre o formulário</div>
<p style="font-size: 12px;">O presente formulário foi criado com o objetivo de promover uma maior organização dos pedidos feitos na seção gráfica deste fórum. Em cada uma das divisões abaixo poderá encontrar uma parte do código, a primeira caixa - "Informações gerais" - vale para o título e a segunda para o corpo da mensagem. Assim que tudo estiver feito, poderá enviar o pedido, que será postado automaticamente. Se necessitar de alguma modificação, poderá fazer editando a sua mensagem. </a>.

</p><span class="corners-bottom"><span></span></span>
</div>
</div>
<div class="clear" style="height: 6px;"></div>

<div class="panel"><div class="inner"><span class="corners-top"><span></span></span><div class="h3" style="margin-top: 7px;">Informações gerais</div>

<form action="/post" method="post" enctype="multipart/form-data" id="fa_form" onSubmit="fa_cookie();">
<fieldset class="fields1">

<dl><dt>
<label>Tipo de pedido :</label></dt><dd><select id="tipo" tabindex="1" onChange="gerartitulo();" />
<option value=""></option>
<option value="[Avatar] ">Avatar</option>
<option value="[Sing]">Sing</option>
<option value="[UserBar] ">Userbar</option>
<option value="[Plano de Fundo] ">Plano de Fundo</option>
<option value="[Kit] ">Kit</option>
</select></dd></dl>

<dl><dt>
<label>Cor geral :</label></dt><dd><select id="cor" tabindex="2" onChange="gerartitulo();" />

<option value=" "></option>

<option value="Vermelho">Vermelho</option>
<option value="Verde">Verde</option>
<option value="Amarelo">Amarelo</option>
<option value="Azul">Azul</option>
<option value="Roxo">Roxo</option>

<option value="Rosa">Rosa</option>

<option value="Laranja">Laranja</option>
<option value="Branco">Branco</option>
<option value="Preto">Preto</option>
<option value="Cinza">Cinza</option>
<option value="Marrom">Marrom</option>

<option value="Transparente">Transparente</option>

<option value="">Nenhuma da lista</option></select> <select id="cortonalidade" onChange="gerartitulo();" />
<option value=""></option>
<option value="">Normal</option>
<option value=" claro">Claro</option>
<option value=" escuro">Escuro</option></select></dd></dl>


<dl><dt>
<label>Tamanho geral :</label></dt><dd><select id="tamanho" tabindex="3" onChange="gerartitulo();" />

<option value=" "></option>
<option value=" - Pequeno ">Pequeno</option>
<option value=" - Médio ">Médio</option>
<option value=" - Grande ">Grande</option></select></dd></dl>

<dl><dt>

<label>Cor geral do texto :</label></dt><dd><select id="texto" tabindex="4" onChange="gerartitulo();" />
<option value=" "></option>

<option value="- Texto vermelho ">Vermelho</option>
<option value="- Texto verde ">Verde</option>
<option value="- Texto amarelo ">Amarelo</option>
<option value="- Texto azul ">Azul</option>

<option value="- Texto roxo ">Roxo</option>
<option value="- Texto rosa ">Rosa</option>

<option value="- Texto laranja ">Laranja</option>
<option value="- Texto branco ">Branco</option>
<option value="- Texto preto ">Preto</option>
<option value="- Texto cinza ">Cinza</option>

<option value="- Texto marrom ">Marrom</option>
<option value="">Nenhuma da lista</option></select> <select id="textotonalidade" onChange="gerartitulo();" />

<option value=""></option>
<option value="">Normal</option>
<option value=" claro">Claro</option>
<option value=" escuro">Escuro</option></select></dd></dl>


</fieldset>
<span class="corners-bottom"><span></span></span></div></div>
<div class="clear" style="height: 6px;"></div><div class="panel"><div class="inner"><span class="corners-top"><span></span></span><div class="h3" style="margin-top: 7px;">Informações específicas</div>

<fieldset class="fields1">

<dl><dt>
<label>Imagens a serem usadas :</label></dt>

<dd>Indique o endereço da imagem a usar. Caso necessite de mais imagens, carregue em +, para que o endereço seja validado. Este irá desaparecer, e poderá então adicionar outro endereço.
<table>
<tr id="addimage">
<td class="part"></td>
<td><div class="more" onClick="addimg()"></div>

</td>
</tr>
</table>


<script type="text/javascript">addimg()</script>

</dd></dl>
<dl><dt>
<label>Dimensões :</label></dt>
<dd> <input class="inputbox" type="text" id="dimensoesL" tabindex="6" onChange="gerarpedido();" style="width: 30px; clear: both;" />

px (largura) X
<input class="inputbox" type="text" id="dimensoesA" tabindex="7" onChange="gerarpedido();" style="width: 30px;" /> px (altura) </dd><dd> <span id="size_extra_span" style="display: none;"> Tamanhos padrões do tipo de pedido escolhido : <select id="size_extra">

<option value=""></option>
<optgroup label="Avatar">
<option value="120 x 120 px">120 x 120 px</option>
<option value="100 x 120 px">100 x 120 px</option>

<option value="120 x 160 px">120 x 160 px</option>
<option value="140 x 180 px">140 x 180 px</option>
<option value="140 x 200 px">140 x 200 px</option>

<option value="150 x 180 px">150 x 180 px</option>
<option value="150 x 200 px">150 x 200 px</option>
</optgroup>

<optgroup label="Assinatura">
<option value="400 x 120 px">400 x 120 px</option>
<option value="400 x 150 px">400 x 150 px</option>
<option value="450 x 150 px">450 x 150 px</option>

</optgroup>
<optgroup label="Userbar">
<option value="350 x 19 px">350 x 19 px</option>

</optgroup>
<optgroup label="Banner">
<option value="70 x 30 px">70 x 30 px</option>
<option value="90 x 15 px">90 x 15 px</option>

<option value="120 x 60 px">120 x 60 px</option>
<option value="150 x 50 px">150 x 50 px</option>
<option value="468 x 60 px">468 x 60 px</option>

</optgroup>
<optgroup label="Logo">
<option value="600 x 200 px">600 x 200 px</option>
<option value="750 x 200 px">750 x 200 px</option>

<option value="800 x 220 px">800 x 220 px</option>
<option value="150 x 50 px">830 x 200 px</option>
</optgroup>

</select></span>
</dd></dl>


<dl><dt>
<label>Cor do fundo :</label></dt>

<dd>Código hexadecimal da cor que deverá ser usada :<br>
<input type="text" tabindex="9" onChange="gerarpedido();" class="inputbox color champ" value="FFFFFF" id="fundo" name="couleur_fond" maxlength="7" onblur="this.style.borderColor='#FFFFFF'" onfocus="this.style.borderColor='#FFFFFF'" style="width: 70px; background: url('http://2img.net/i/fa/wysiwyg/color_swatch.png') no-repeat right;" />
</dd></dl>


<dl><dt>
<label>Cor da fonte :</label></dt>
<dd>Código hexadecimal da cor que deverá ser usada :<br>
<input type="text" tabindex="10" onChange="gerarpedido();" class="inputbox color champ" value="FFFFFF" id="fontecor" name="couleur_fond" maxlength="7" onblur="this.style.borderColor='#FFFFFF'" onfocus="this.style.borderColor='#FFFFFF'" style="width: 70px; background: url('http://2img.net/i/fa/wysiwyg/color_swatch.png') no-repeat right;" />
</dd></dl>

<dl><dt>

<label>Fonte :</label></dt><dd><select id="fonte" tabindex="11" onChange="outra('fonte'); gerarpedido();" />
<option value=" "></option>

<option value="Arial" style="font-family: Arial;">Arial</option>
<option value="Arial Black" style="font-family: Arial Black;">Arial Black</option>
<option value="Comic Sans MS" style="font-family: Comic Sans MS;">Comic Sans MS</option>
<option value="Courier New" style="font-family: Courier New;">Courier New</option>

<option value="Georgia" style="font-family: Georgia;">Georgia</option>
<option value="Times New Roman" style="font-family: Times New Roman;">Times New Roman</option>

<option value="Calibri" style="font-family: Calibri;">Calibri</option>
<option value="Trebuchet MS" style="font-family: Trebuchet MS;">Trebuchet MS</option>
<option value="Verdana" style="font-family: Verdana;">Verdana</option>
<option value="Visitor TTK 2" style="font-family: Visitor TTK 2;">Visitor TTK 2 (usada em Userbars)</option>

<option value="">Outra</option>
</select> <input id="fonteNome" style="display: none; width: 400px;" class="inputbox" value="Qual?" onclick="if (this.value == 'Qual?') this.value = '';" onblur="if (this.value == '') this.value = 'Qual?';" onChange="gerarpedido();" onfocus="if (this.value == 'Qual?') this.value = '';" onblur="if (this.value == '') this.value = 'Qual?';"></dd></dl>


<dl><dt>
<label>Animação :</label></dt><dd><select id="animacao" tabindex="12" onChange="outra('animacao'); gerarpedido();" />
<option value=" "></option>
<option value="Não">Não</option>
<option value="">Sim</option>

</select> <input id="animacaoNome" style="display: none; width: 400px;" class="inputbox" value="Como?" onclick="if (this.value == 'Como?') this.value = '';" onblur="if (this.value == '') this.value = 'Como?';" onChange="gerarpedido();" onfocus="if (this.value == 'Como?') this.value = '';" onblur="if (this.value == '') this.value = 'Como?';"></dd></dl>

<dl><dt>

<label>Moldura :</label></dt><dd><select id="moldura" tabindex="13" onChange="outra('moldura'); gerarpedido();" />
<option value=" "></option>
<option value="Não">Não</option>
<option value="">Sim</option>
</select> <input id="molduraNome" style="display: none; width: 400px;" class="inputbox" value="Como?" onclick="if (this.value == 'Como?') this.value = '';" onblur="if (this.value == '') this.value = 'Como?';" onChange="gerarpedido();" onfocus="if (this.value == 'Como?') this.value = '';" onblur="if (this.value == '') this.value = 'Como?';" /></dd></dl>

<dl><dt>
<label>Descrição do trabalho :</label></dt>

<dd><textarea class="inputbox" id="adicionais" tabindex="14" onChange="gerarpedido();" style="clear: both; height: 100px; width: 500px;"></textarea></dd></dl>

</fieldset>

<input type="hidden" name="message" />
<input type="hidden" name="subject" />
<input type="hidden" name="mode" value="newtopic" />
<input type="hidden" name="f" value="59" />
<input type="hidden" name="lt" value="0" />



<span class="corners-bottom"><span></span></span></div></div>

<div class="panel"><div class="inner"><span class="corners-top"><span></span></span>
<fieldset class="submit-buttons"><input value="Enviar seu pedido gráfico" type="submit" class="button1" name="post" /></fieldset>
<span class="corners-bottom"><span></span></span></div>
</form>
<script>gerartitulo();</script>
muryllodantas
muryllodantas
Membro

Membro desde : 31/10/2010
Mensagens : 760
Pontos : 1013

http://rendersdesigner.forumeiro.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Personalizar o botão "novo tópico" - fórmulário

Mensagem por Konai 01.01.11 20:52

Eu peguei o código do muryllodantas e modifiquei pequenas coisas... veja se resolve seu problema.

Código:
<style>
.previsu {
background: url('http://sd-1.archive-host.com/membres/images/142586199450897653/LFD/vide.png');
border: 1px solid #1675BC;
display: none;
position: absolute;
top: 350px;
margin: auto;
margin-left: 150px !important;
}
.previsuimg {
position: relative;
}
.previsuimg div {
position: absolute; top: 30px; left: -10px; border: 3px double #E0E0E0; background: rgba(250, 250, 250, 0.9);
}


#addimage .part { background: url(http://i46.tinypic.com/2wrdc42.jpg) no-repeat -235px -600px; width: 60px; height: 20px;}
#addimage .more { background: url(http://i46.tinypic.com/2wrdc42.jpg) no-repeat 0px 2px; width: 12px; height: 20px; cursor:pointer;}
.image .part { background: url(http://i46.tinypic.com/2wrdc42.jpg) no-repeat -235px -548px; width: 60px; height: 20px;}
.image .remove { float: left;background: url(http://i46.tinypic.com/2wrdc42.jpg) no-repeat 0px -286px;padding-left: 16px;width: 12px; height: 20px; cursor:pointer;position: relative;top:3px;}
.image .previsualise { float: left;background: url(http://i46.tinypic.com/2wrdc42.jpg) no-repeat -50px -436px; margin-left: 5px; padding-left: 16px;width: 12px; height: 20px; cursor:pointer;position: relative;top:3px;}

.image { width: 300px; }

</style>
<script type="text/javascript" src="http://jscolor.com/jscolor/jscolor.js"></script>
<script>
function gerartitulo() {
var tipo = document.getElementById("tipo").value;
var cor = document.getElementById("cor").value;
var tamanho = document.getElementById("tamanho").value;
var texto = document.getElementById("texto").value;
var textotonalidade = document.getElementById("textotonalidade").value;
var cortonalidade = document.getElementById("cortonalidade").value;

jQuery("input[name=subject]").attr('value', tipo+cor+cortonalidade+tamanho+texto+textotonalidade);
jQuery("#titlecode").html(tipo+cor+cortonalidade+tamanho+texto+textotonalidade);

if(tipo == "[Avatar] " || tipo == "[Assinatura] " || tipo == "[Userbar] " || tipo == "[Banner] " || tipo == "[Logo] ") {
jQuery('#size_extra optgroup').css('display','block');
jQuery('#size_extra optgroup[label!=' + tipob + ']').css('display','none');
jQuery('#size_extra_span').css('display','block');
}
else {
jQuery('#size_extra_span').css('display','none');
}
}
imagensdopedido = '';

function gerarpedido() {
gerartitulo();
var cordofundo = document.getElementById("fundo").value;
var cordafonte = document.getElementById("fontecor").value;
var nomedafonte = (document.getElementById("fonte").value == '') ? document.getElementById("fonteNome").value : document.getElementById("fonte").value;
var tipodeanimacao = (document.getElementById("animacao").value == '') ? document.getElementById("animacaoNome").value : document.getElementById("animacao").value;
var tipodemoldura = (document.getElementById("moldura").value == '') ? document.getElementById("molduraNome").value : document.getElementById("moldura").value;
var descricaodopedido = document.getElementById("adicionais").innerHTML;
var descricaodopedido = document.getElementById("adicionais").value;
var dimensaoA = document.getElementById("dimensoesA").value;
var dimensaoL = document.getElementById("dimensoesL").value;

var dimensaof = (document.getElementById("size_extra").value == '') ? dimensaoA + ' x ' + dimensaoL + ' px' : document.getElementById("size_extra").value;

var urlforum = document.getElementById("urlforum").value;

finalmessage = 'Endereço do fórum : [url]'+ urlforum + '[/url]\nImagens a serem usadas : ' + imagensdopedido + '\n Dimensões : ' + dimensaof +' \nCor do fundo : #' + cordofundo + '\nCor da fonte : #' + cordafonte + '\nFonte : ' + nomedafonte + '\nAnimação : ' + tipodeanimacao + '\nMoldura : ' + tipodemoldura + '\nDescrição do trabalho : ' + descricaodopedido;


jQuery("input[name=message]").attr('value', finalmessage);
}

function outra(id) {
var inputID = id+"Nome";
(document.getElementById(id).value == '') ? document.getElementById(inputID).style.display = 'inline' : document.getElementById(inputID).style.display = 'none';
document.getElementById(inputID).focus();
}

function removeimg(obj) {
obj.parent().parent().remove();
update_img();
}
function addimg() {
$('#addimage').before('<tr class=image><td class=part></td><td><input style="float:left; display: inline; background-color: #ffffff;border: 1px solid #BCBCBC;color: #666666;padding: 2px;cursor: text;" type=text name=images onchange="update_img_list()" /> <div class="previsualise"></div> <div class="remove" onClick="removeimg($(this))"></div><div class="previsuimg"><div></div></div></td></tr>');
$('#addimage').prev().find('.previsualise').hover(
function () {
$(this).parent().find('.previsuimg').html('<div><img src="'+encodeURI($(this).parent().find('input').attr('value'))+'" /></div>').find('div').css('display','block');
},
function () {
$(this).parent().find('.previsuimg div').css('display','none');
}
);
update_img();
}
function update_img() {
if($('.image').length<2) $('.image .remove').hide();
else $('.image .remove').show();
update_img_list();
}

function update_img_list() {
imagensdopedido = '';
jQuery('input[name=images]').each( function(index) {
if($(this).val() != '') {
imagensdopedido = imagensdopedido + $(this).val() + ' ; ';
}
});
gerarpedido();
}

gerartitulo();
gerarpedido();

</script>
<h1 class="page-title">Pedidos de Designer. Avatar, Sing, UserBar, Plano de Fundo ou até mesmo um Kit.. </h1><div class="panel row2"><div class="inner"><span class="corners-top"><span></span></span><div class="h3" style="margin-top: 7px;">Sobre o formulário</div>
<p style="font-size: 12px;">O presente formulário foi criado com o objetivo de promover uma maior organização dos pedidos feitos na seção gráfica deste fórum. Em cada uma das divisões abaixo poderá encontrar uma parte do código, a primeira caixa - "Informações gerais" - vale para o título e a segunda para o corpo da mensagem. Assim que tudo estiver feito, poderá enviar o pedido, que será postado automaticamente. Se necessitar de alguma modificação, poderá fazer editando a sua mensagem. </a>.

</p><span class="corners-bottom"><span></span></span>
</div>
</div>
<div class="clear" style="height: 6px;"></div>

<div class="panel"><div class="inner"><span class="corners-top"><span></span></span><div class="h3" style="margin-top: 7px;">Informações gerais</div>

<form action="/post" method="post" enctype="multipart/form-data" id="fa_form" onSubmit="fa_cookie();">
<fieldset class="fields1">

<dl><dt>
<label>Tipo de pedido :</label></dt><dd><select id="tipo" tabindex="1" onChange="gerartitulo();" />
<option value=""></option>
<option value="[Avatar] ">Avatar</option>
<option value="[Sing]">Sing</option>
<option value="[UserBar] ">Userbar</option>
<option value="[Plano de Fundo] ">Plano de Fundo</option>
<option value="[Kit] ">Kit</option>
</select></dd></dl>

<dl><dt>
<label>Cor geral :</label></dt><dd><select id="cor" tabindex="2" onChange="gerartitulo();" />

<option value=" "></option>

<option value="Vermelho">Vermelho</option>
<option value="Verde">Verde</option>
<option value="Amarelo">Amarelo</option>
<option value="Azul">Azul</option>
<option value="Roxo">Roxo</option>

<option value="Rosa">Rosa</option>

<option value="Laranja">Laranja</option>
<option value="Branco">Branco</option>
<option value="Preto">Preto</option>
<option value="Cinza">Cinza</option>
<option value="Marrom">Marrom</option>

<option value="Transparente">Transparente</option>

<option value="">Nenhuma da lista</option></select> <select id="cortonalidade" onChange="gerartitulo();" />
<option value=""></option>
<option value="">Normal</option>
<option value=" claro">Claro</option>
<option value=" escuro">Escuro</option></select></dd></dl>


<dl><dt>
<label>Tamanho geral :</label></dt><dd><select id="tamanho" tabindex="3" onChange="gerartitulo();" />

<option value=" "></option>
<option value=" - Pequeno ">Pequeno</option>
<option value=" - Médio ">Médio</option>
<option value=" - Grande ">Grande</option></select></dd></dl>

<dl><dt>

<label>Cor geral do texto :</label></dt><dd><select id="texto" tabindex="4" onChange="gerartitulo();" />
<option value=" "></option>

<option value="- Texto vermelho ">Vermelho</option>
<option value="- Texto verde ">Verde</option>
<option value="- Texto amarelo ">Amarelo</option>
<option value="- Texto azul ">Azul</option>

<option value="- Texto roxo ">Roxo</option>
<option value="- Texto rosa ">Rosa</option>

<option value="- Texto laranja ">Laranja</option>
<option value="- Texto branco ">Branco</option>
<option value="- Texto preto ">Preto</option>
<option value="- Texto cinza ">Cinza</option>

<option value="- Texto marrom ">Marrom</option>
<option value="">Nenhuma da lista</option></select> <select id="textotonalidade" onChange="gerartitulo();" />

<option value=""></option>
<option value="">Normal</option>
<option value=" claro">Claro</option>
<option value=" escuro">Escuro</option></select></dd></dl>


</fieldset>
<span class="corners-bottom"><span></span></span></div></div>
<div class="clear" style="height: 6px;"></div><div class="panel"><div class="inner"><span class="corners-top"><span></span></span><div class="h3" style="margin-top: 7px;">Informações específicas</div>

<fieldset class="fields1">

<dl><dt>
<label>Imagens a serem usadas :</label></dt>

<dd>Indique o endereço da imagem a usar. Caso necessite de mais imagens, carregue em +, para que o endereço seja validado. Este irá desaparecer, e poderá então adicionar outro endereço.
<table>
<tr id="addimage">
<td class="part"></td>
<td><div class="more" onClick="addimg()"></div>

</td>
</tr>
</table>


<script type="text/javascript">addimg()</script>

</dd></dl>
<dl><dt>
<label>Dimensões :</label></dt>
<dd> <input class="inputbox" type="text" id="dimensoesL" tabindex="6" onChange="gerarpedido();" style="width: 30px; clear: both;" />

px (largura) X
<input class="inputbox" type="text" id="dimensoesA" tabindex="7" onChange="gerarpedido();" style="width: 30px;" /> px (altura) </dd><dd> <span id="size_extra_span" style="display: none;"> Tamanhos padrões do tipo de pedido escolhido : <select id="size_extra">

<option value=""></option>
<optgroup label="Avatar">
<option value="120 x 120 px">120 x 120 px</option>
<option value="100 x 120 px">100 x 120 px</option>

<option value="120 x 160 px">120 x 160 px</option>
<option value="140 x 180 px">140 x 180 px</option>
<option value="140 x 200 px">140 x 200 px</option>

<option value="150 x 180 px">150 x 180 px</option>
<option value="150 x 200 px">150 x 200 px</option>
</optgroup>

<optgroup label="Assinatura">
<option value="400 x 120 px">400 x 120 px</option>
<option value="400 x 150 px">400 x 150 px</option>
<option value="450 x 150 px">450 x 150 px</option>

</optgroup>
<optgroup label="Userbar">
<option value="350 x 19 px">350 x 19 px</option>

</optgroup>
<optgroup label="Banner">
<option value="70 x 30 px">70 x 30 px</option>
<option value="90 x 15 px">90 x 15 px</option>

<option value="120 x 60 px">120 x 60 px</option>
<option value="150 x 50 px">150 x 50 px</option>
<option value="468 x 60 px">468 x 60 px</option>

</optgroup>
<optgroup label="Logo">
<option value="600 x 200 px">600 x 200 px</option>
<option value="750 x 200 px">750 x 200 px</option>

<option value="800 x 220 px">800 x 220 px</option>
<option value="150 x 50 px">830 x 200 px</option>
</optgroup>

</select></span>
</dd></dl>


<dl><dt>
<label>Cor do fundo :</label></dt>

<dd>Código hexadecimal da cor que deverá ser usada :<br>
<input type="text" tabindex="9" onChange="gerarpedido();" class="inputbox color champ" value="FFFFFF" id="fundo" name="couleur_fond" maxlength="7" onblur="this.style.borderColor='#FFFFFF'" onfocus="this.style.borderColor='#FFFFFF'" style="width: 70px; background: url('http://2img.net/i/fa/wysiwyg/color_swatch.png') no-repeat right;" />
</dd></dl>


<dl><dt>
<label>Cor da fonte :</label></dt>
<dd>Código hexadecimal da cor que deverá ser usada :<br>
<input type="text" tabindex="10" onChange="gerarpedido();" class="inputbox color champ" value="FFFFFF" id="fontecor" name="couleur_fond" maxlength="7" onblur="this.style.borderColor='#FFFFFF'" onfocus="this.style.borderColor='#FFFFFF'" style="width: 70px; background: url('http://2img.net/i/fa/wysiwyg/color_swatch.png') no-repeat right;" />
</dd></dl>

<dl><dt>

<label>Fonte :</label></dt><dd><select id="fonte" tabindex="11" onChange="outra('fonte'); gerarpedido();" />
<option value=" "></option>

<option value="Arial" style="font-family: Arial;">Arial</option>
<option value="Arial Black" style="font-family: Arial Black;">Arial Black</option>
<option value="Comic Sans MS" style="font-family: Comic Sans MS;">Comic Sans MS</option>
<option value="Courier New" style="font-family: Courier New;">Courier New</option>

<option value="Georgia" style="font-family: Georgia;">Georgia</option>
<option value="Times New Roman" style="font-family: Times New Roman;">Times New Roman</option>

<option value="Calibri" style="font-family: Calibri;">Calibri</option>
<option value="Trebuchet MS" style="font-family: Trebuchet MS;">Trebuchet MS</option>
<option value="Verdana" style="font-family: Verdana;">Verdana</option>
<option value="Visitor TTK 2" style="font-family: Visitor TTK 2;">Visitor TTK 2 (usada em Userbars)</option>

<option value="">Outra</option>
</select> <input id="fonteNome" style="display: none; width: 400px;" class="inputbox" value="Qual?" onclick="if (this.value == 'Qual?') this.value = '';" onblur="if (this.value == '') this.value = 'Qual?';" onChange="gerarpedido();" onfocus="if (this.value == 'Qual?') this.value = '';" onblur="if (this.value == '') this.value = 'Qual?';"></dd></dl>


<dl><dt>
<label>Animação :</label></dt><dd><select id="animacao" tabindex="12" onChange="outra('animacao'); gerarpedido();" />
<option value=" "></option>
<option value="Não">Não</option>
<option value="">Sim</option>

</select> <input id="animacaoNome" style="display: none; width: 400px;" class="inputbox" value="Como?" onclick="if (this.value == 'Como?') this.value = '';" onblur="if (this.value == '') this.value = 'Como?';" onChange="gerarpedido();" onfocus="if (this.value == 'Como?') this.value = '';" onblur="if (this.value == '') this.value = 'Como?';"></dd></dl>

<dl><dt>

<label>Moldura :</label></dt><dd><select id="moldura" tabindex="13" onChange="outra('moldura'); gerarpedido();" />
<option value=" "></option>
<option value="Não">Não</option>
<option value="">Sim</option>
</select> <input id="molduraNome" style="display: none; width: 400px;" class="inputbox" value="Como?" onclick="if (this.value == 'Como?') this.value = '';" onblur="if (this.value == '') this.value = 'Como?';" onChange="gerarpedido();" onfocus="if (this.value == 'Como?') this.value = '';" onblur="if (this.value == '') this.value = 'Como?';" /></dd></dl>

<dl><dt>
<label>Descrição do trabalho :</label></dt>

<dd><textarea class="inputbox" id="adicionais" tabindex="14" onChange="gerarpedido();" style="clear: both; height: 100px; width: 500px;"></textarea></dd></dl>

</fieldset>

<input type="hidden" name="message" />
<input type="hidden" name="subject" />
<input type="hidden" name="mode" value="newtopic" />
<input type="hidden" name="f" value="59" />
<input type="hidden" name="lt" value="0" />



<span class="corners-bottom"><span></span></span></div></div>

<div class="panel"><div class="inner"><span class="corners-top"><span></span></span>
<fieldset class="submit-buttons"><input value="Enviar seu pedido gráfico" type="submit" class="button1" name="post" /></fieldset>
<span class="corners-bottom"><span></span></span></div>
</form>
<script>gerartitulo();</script>

Se " sim " coloque o tópico como Resolvido, se " não " deixe o tópico como está e espere outros membros para ajuda-lo e os mais específicos para isto seria os ajudeiros dessa área portanto, peço um pouco de paciência.

Att,

Nestle.
Konai
Konai
Membro Entusiasta

Membro desde : 07/08/2010
Mensagens : 6045
Pontos : 7550

http://narutongo.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Personalizar o botão "novo tópico" - fórmulário

Mensagem por Cristian 95 01.01.11 23:03

Ok.. os dois funcionou.. o titulo do tópico do fórum funcionou.. só falta arruma os negocios pro corpo.. as mensagens, não funcionou ;/

"Antes de postar, você deve escrever uma mensagem."
Cristian 95
Cristian 95
Membro

Membro desde : 16/12/2010
Mensagens : 946
Pontos : 1278

http://secondlifevirtual.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Personalizar o botão "novo tópico" - fórmulário

Mensagem por Cristian 95 02.01.11 23:03

Bom.. eu fiquei um 10 minutos estudando o código.. e vi que o erro tava nesses que código que já está alterado (esse que vou postar agora é o alterado)
Spoiler:

ai ele cria o tópico né de boa, mais ai o titulo e a mensagem fica essa "O script não enviou a mensagem" -.-" alguem passa o código certo por favor? *-*
Cristian 95
Cristian 95
Membro

Membro desde : 16/12/2010
Mensagens : 946
Pontos : 1278

http://secondlifevirtual.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Personalizar o botão "novo tópico" - fórmulário

Mensagem por Cristian 95 03.01.11 0:16

desculpa.. é que eu modifica o "ANP" anterior.. então ANP novamente pra verem minha nova mensagem RUA apaixonado
Cristian 95
Cristian 95
Membro

Membro desde : 16/12/2010
Mensagens : 946
Pontos : 1278

http://secondlifevirtual.forumeiros.com/

Ir para o topo Ir para baixo

Ir para o topo

- Tópicos semelhantes

 
Permissões neste sub-fórum
Não podes responder a tópicos