Formulario de SKINS
Página 1 de 1
Formulario de SKINS
Queria que o formulario depois de enviar fosse para aqui: http://mundodosforuns.forum-pro.net/f36-pedido-adaptar
http://mundodosforuns.forum-pro.net/ PunBB
- Código:
<div style="height:3px">
</div><style>
select {padding: 3px;}
.button1 {display: inline-block;}
.submit-buttons{
float: left;
}
#right {height: 0px;}
#content-container div#content {
margin-right: 0px;
}
.inner dl {
border-bottom: 1px solid #F7F7F7;
padding: 8px 3px;
}
.inner dt {
display: inline-block;
width: 200px;
text-align: right;
padding-right: 8px;
}
.inner dd {padding-left: 23px;padding: 10px 5px;display: inline-block; left: 400px;}
h2.headerText {
font-size: 24px;
font-family: "Source Sans Pro", "Myriad Pro", "Trebuchet MS", sans-serif;
font-weight: 200;
line-height: 160%;
padding: 10px;
}
a.qganho {
display: block;
text-decoration: none;
font-weight: bold;
float: right;
height: 40px;
margin-top: -45px;
line-height: 40px;
padding: 0 8px;
background: #4A6C88;
color: white !important;
outline: none;
}
.m_info {
background: #4A6C88;
padding: 10px;
color: white;
margin-bottom: 6px;
display: none;
clear: right;
}
.oqueganho {
background: #354E62;
margin: 5px 0 0 0;
line-height: 150%;
}
.oqueganho td {
background: #3E5A71;
padding: 5px 2px 5px 30px;
border: 1px solid #4B657A;
width: 50%;
}
.oqueganho img {
position: relative;
margin-left: -25px;
margin-right: 5px;
}
.border-color {
border: 1px solid #DDD;
width: 135px;
background: white;
height: 50px;
padding: 3px;
display: block;
float: left;
margin: 0 8px 0 0;
}
input.inputbox.color.champ {
border: 0;
width: 135px;
height: 50px;
display: block;
padding: 0;
margin: 0;
text-align: center;
cursor: pointer;
font-size: 14px;
font-weight: bold;
color: black;
color: rgba(0, 0, 0, 0.6);
text-shadow: rgba(255, 255, 255, 0.2) 0px 1px 0px;
box-shadow: inset rgba(0, 0, 0, 0.3) 0px 1px 2px;
}
</style><script type="text/javascript" src="http://jscolor.com/jscolor/jscolor.js"></script><script>
html_tpl = "<b>Nome do Fórum:</b> $0 <br><br><b>Url do fórum:</b> $1 <br><br><b>E-mail:</b> $2<br><br><b>Versão que desejo:</b> $3 <br><br><b>Cores para minha skin:</b> $4 | $5 | $6 | $7<br><br><b>Descrição da skin:</b> $8 <br><br>";
bbcode_tpl = "[b]Nome do site:[/b]\n$0\n[b]Url do fórum:[/b]\n$1 \n[b]E-mail:[/b]\n$2\n[b]Versão que desejo:[/b]\n$3\n[b]Cores para minha skin:[/b]\n$4 | $5 | $6 | $7\n[b]Descrição da skin:[/b]\n$8";
$(document).ready(function(){
$('#bt-apagar').click(function() {
$('#form-submit input[type="text"],#form-submit textarea').val('');
$('input[name="f"]').val($(this).val());
});
$('#bt-pr-questao').click(function() {
tpl = html_tpl;
tpl = tpl.replace("$0", $('#nomesite').val());
tpl = tpl.replace("$1", $('#urlforum').val());
tpl = tpl.replace("$2", $('#email').val());
tpl = tpl.replace("$3", $('#versao').val());
tpl = tpl.replace("$4", $('#cor1').val());
tpl = tpl.replace("$5", $('#cor2').val());
tpl = tpl.replace("$6", $('#cor3').val());
tpl = tpl.replace("$7", $('#cor4').val());
tpl = tpl.replace("$8", $('#text_editor_textarea').val());
$('html, body').animate({
scrollTop: $("#pr-questao").offset().top
}, 800);
$('#pr-questao').slideDown(300);
$('#html-questao').html(tpl);
});
$('#bt-enviar').click(function() {
tpl = bbcode_tpl;
if($('#nomesite').val()!=='' && $('#urlforum').val()!=='' && $('#email').val()!=='' && $('#versao').val()!=='' && $('#cor1').val()!=='' && $('#cor2').val()!=='' && $('#cor3').val()!=='' && $('#cor4').val()!=='' && $('#text_editor_textarea').val()!==''){
tpl = tpl.replace("$0", $('#nomesite').val());
tpl = tpl.replace("$1", $('#urlforum').val());
tpl = tpl.replace("$2", $('#email').val());
tpl = tpl.replace("$3", $('#versao').val());
tpl = tpl.replace("$4", $('#cor1').val());
tpl = tpl.replace("$5", $('#cor2').val());
tpl = tpl.replace("$6", $('#cor3').val());
tpl = tpl.replace("$7", $('#cor4').val());
tpl = tpl.replace("$8", $('#text_editor_textarea').val());
$('input[name="message"]').val(tpl);
$('input[name="subject"]').val($('#nomesite').val());
$('#bt-enviar-e').click();
$('#form-submit').slideUp(300);
$('#enviado').slideDown(800);
}else{
$('#erro').slideUp(1);
$('#erro').slideDown(800);
}
});
$('#bt-pr-fechar').click(function() {
$('html, body').animate({
scrollTop: $("#pr-questao").offset().top
}, 800);
$('#pr-questao').slideUp(300);
return false;
});
$('#nomesite').click(function() {
if($('#nomesite').val()=='Coloque aqui um título descritivo sobre a sua questão'){
$('#nomesite').val('');
}
});
jQuery('#nomesite').keyup(function(){
var t=document.getElementById('nomesite').value.length;
var i=document.getElementById('identifytitle');
if(t<10&&t>0){
var l=t-10;i.innerHTML='Necessita mais '+l*-1+' caracteres'
}
else{
i.innerHTML=''
}
});
if(VarGET('f')!==''){
$('#form-part2, #bts').slideDown(800);
$('input[name="f"]').val(VarGET('f'));
$('#bt-selecciona-forum').val(VarGET('f'));
}
});
</script>
<form action="/post" method="post" id="form-submit">
<div id="erro" style="display:none;" class="panel">
<div class="inner"><span class="corners-top"><span></span></span>
<center><span class="conteudo_texto" style="color:#C00"><strong>Você deve preencher todos os campos</strong></span>
</center><span class="corners-bottom"><span></span></span>
</div>
</div><br />
<div style="display:none;" id="pr-questao" class="post row2">
<div class="inner"><span class="corners-top"><span></span></span>
<div class="postbody">
<div class="h3">
Pré-visualizar [<a id="bt-pr-fechar" href="#">Fechar o modo de pré-visualização da questão</a>]
</div>
<div id="html-questao" class="content">
</div>
</div><span class="corners-bottom"><span></span></span>
</div>
</div>
<hr style="display:none;" id="pr-questao" /><br />
<div class="panel">
<div class="inner">
<h2 class="headerText textLeft">
Deseja uma skin exclusiva? Preencha o formulário abaixo para um orçamento gratuito!
</h2><a href="#" class="qganho" onclick="jQuery('.m_info').slideToggle();return false;"><img src="http://cdn2.iconfinder.com/data/icons/humano2/16x16/apps/gnome-help.png" alt="" /> Informações <img src="http://i.imgur.com/Bk6NwuD.png" alt="" /></a>
<div class="m_info" style="display: none; ">
As skins personalizadas para forumeiros irão variar muito de preço, devido à complexidade e requisitos de cada skin. Skins detalhadas são naturalmente mais caros do que as skins simples por geralmente ser necessário mais trabalho.Todas as skin que são complexas serão compradas por dinheiro real.<br /><br />Sua skin customizada virá com o seguinte:<br />
<table class="oqueganho" cellspacing="1">
<tbody>
<tr>
<td><img src="http://cdn3.iconfinder.com/data/icons/musthave/16/Picture.png" alt="" /> Design personalizado da skin que será vendido apenas para o seu site
</td>
<td><img src="http://cdn4.iconfinder.com/data/icons/CS5/16/PS_GenericFileIcon%202_file_document.png" alt="" /> Todos os arquivos. PSD (Adobe Photoshop), criado ao fazer a skin
</td>
</tr>
<tr>
<td><img src="http://cdn3.iconfinder.com/data/icons/multimedia/100/picture_1-16.png" alt="" /> O acesso a uma skin de desenvolvimento, onde você pode acompanhar o andamento de sua skin
</td>
<td><img src="http://cdn2.iconfinder.com/data/icons/vaga/comment.png" alt="" /> (Cliente a designer) A comunicação ao longo de todo o processo de produção da skin
</td>
</tr>
<tr>
<td><img src="http://cdn3.iconfinder.com/data/icons/fatcow/16/page_code.png" alt="" /> Código limpo, moderno e formatado permitindo modificações mais fáceis no futuro
</td>
<td><img src="http://cdn2.iconfinder.com/data/icons/basicset/help_16.png" alt="" /> Suporte ilimitado: se você tiver um problema causado pela skin, é só pedir ajuda!
</td>
</tr>
</tbody>
</table>
</div>
</div><span class="corners-bottom"></span>
</div>
<div class="panel" id="form-part2" style="">
<div class="inner"><span class="corners-top"><span></span></span>
<div class="h3" style="margin-top: 7px;">
Formulário de pedir para adaptar skins.
</div><br /><fieldset class="fields1"><dl><dt></dt><label></label>Nome do seu site:<dd><input type="text" id="nomesite" placeholder="Nome do seu site" class="inputbox" style="clear: both; width: 780px;" /></dd></dl></fieldset>
<div id="identifytitle" style="display: inline;">
</div><fieldset class="fields1"><dl></dl><dd></dd><br /><dl><dt></dt><label></label>Url do fórum:<dd><input type="text" id="urlforum" placeholder="http://forum.com/forum" class="inputbox" style="clear: both; width: 780px;" /></dd></dl></fieldset>
<div id="urlforum" style="display: inline;">
</div><fieldset class="fields1"><dl></dl><dd></dd><br /><dl><dt></dt><label></label>E-mail:<dd><input type="text" id="email" placeholder="mundodosforuns@hotmail.com" class="inputbox" style="clear: both; width: 780px;" /></dd></dl></fieldset>
<div id="email" style="display: inline;">
</div><fieldset class="fields1"><dl></dl><dd></dd><br /><dl></dl><dt></dt><label></label>Versão que desejo:<dd></dd><select class="inputbox" id="versao"></select><option value="PhpBB3"></option>PhpBB3<option value="PunBB"></option>PunBB<option value="PhpBB2"></option>PhpBB2<option value="Invision"></option>Invision<br /><dl></dl><dt></dt><label></label>Cores para minha skin:<br /><dd></dd><span class="border-color"></span><input type="text" tabindex="9" onchange="gerarpedido();" class="inputbox color champ" value="FFFFFF" id="cor1" name="couleur_fond" maxlength="7" onblur="this.style.borderColor='#FFFFFF'" onfocus="this.style.borderColor='#FFFFFF'" /><span class="border-color"></span><input type="text" tabindex="9" onchange="gerarpedido();" class="inputbox color champ" value="FFFFFF" id="cor2" name="couleur_fond" maxlength="7" onblur="this.style.borderColor='#FFFFFF'" onfocus="this.style.borderColor='#FFFFFF'" /><span class="border-color"></span><input type="text" tabindex="9" onchange="gerarpedido();" class="inputbox color champ" value="FFFFFF" id="cor3" name="couleur_fond" maxlength="7" onblur="this.style.borderColor='#FFFFFF'" onfocus="this.style.borderColor='#FFFFFF'" /><span class="border-color"></span><input type="text" tabindex="9" onchange="gerarpedido();" class="inputbox color champ" value="FFFFFF" id="cor4" name="couleur_fond" maxlength="7" onblur="this.style.borderColor='#FFFFFF'" onfocus="this.style.borderColor='#FFFFFF'" /><br /><dl><dt></dt><span id="text_editor" style="
display: block;
padding-bottom: 5px;
height: 30px;
margin-bottom: 0px;
padding-top: 10px;
width: 500px;
"></span><button class="button2" onclick="bbcode_tag('[b]','[/b]')" onmouseover="helpline('b')" type="button" id="addbbcode0" accesskey="b" title="Negrito"></button><img src="http://2img.net/i/fa/wysiwyg/text_bold.png" alt="Negrito" title="Negrito" /><button class="button2" onclick="bbcode_tag('[i]','[/i]')" onmouseover="helpline('i')" type="button" id="addbbcode2" accesskey="i" title="Itál."></button><img src="http://2img.net/i/fa/wysiwyg/text_italic.png" alt="Itál." title="Itál." /> <button class="button2" onclick="bbcode_tag('[u]','[/u]')" onmouseover="helpline('u')" type="button" id="addbbcode4" accesskey="u" title="Sublinhar"></button><img src="http://2img.net/i/fa/wysiwyg/text_underline.png" alt="Sublinhar" title="Sublinhar" /><strong style="font-size:11px"></strong> <button class="button2" onclick="bbcode_tag('[left]','[/left]')" onmouseover="helpline('m')" type="button" id="addbbcode52" accesskey="m" title="Esquerda"></button><img src="http://2img.net/i/fa/wysiwyg/text_align_left.png" alt="Esquerda" title="Esquerda" /> <button class="button2" onclick="bbcode_tag('[center]','[/center]')" onmouseover="helpline('t')" type="button" id="addbbcode30" accesskey="t" title="Centralizar"></button><img src="http://2img.net/i/fa/wysiwyg/text_align_center.png" alt="Centralizar" title="Centralizar" /> <button class="button2" onclick="bbcode_tag('[right]','[/right]')" onmouseover="helpline('g')" type="button" id="addbbcode32" accesskey="g" title="Direita"></button><img src="http://2img.net/i/fa/wysiwyg/text_align_right.png" alt="Direita" title="Direita" /><strong style="font-size:11px"></strong> <button class="button2" onclick="bbcode_tag('[list][*]','[/list]')" onmouseover="helpline('l')" type="button" id="addbbcode10" accesskey="l" title="-Lista"></button><img src="http://2img.net/i/fa/wysiwyg/text_list_bullets.png" alt="-Lista" title="-Lista" /> <button class="button2" onclick="bbcode_tag('[list=1][*]','[/list]')" onmouseover="helpline('o')" type="button" id="addbbcode12" accesskey="o" title="Lista ordenada"></button><img src="http://2img.net/i/fa/wysiwyg/text_list_numbers.png" alt="Lista ordenada" title="Lista ordenada" /><strong style="font-size:11px"></strong> <button class="button2" onclick="bbcode_tag('[img]','[/img]')" onmouseover="helpline('p')" type="button" id="addbbcode14" accesskey="p" title="Imagem"></button><img src="http://2img.net/i/fa/wysiwyg/picture.png" alt="Imagem" title="Imagem" /> <button class="button2" onclick="bbcode_tag('[url=','][/url]')" onmouseover="helpline('w')" type="button" id="addbbcode16" accesskey="w" title="Link"></button><img src="http://2img.net/i/fa/wysiwyg/link.png" alt="Link" title="Link" /><label></label>Descrição da skin:<dd><textarea id="text_editor_textarea" name="questao" class="inputbox" tabindex="14" style="clear: both; height: 280px; width:880px;"></textarea></dd></dl></fieldset>
<div style="alignment-baseline: auto; background-attachment: scroll; background-clip: border-box; background-color: rgba(0, 0, 0, 0); background-image: none; background-origin: padding-box; background-size: auto; baseline-shift: baseline; bottom: auto; box-shadow: none; box-sizing: content-box; caption-side: top; clear: none; clip: auto; clip-path: none; clip-rule: nonzero; color: rgb(0, 0, 0); color-interpolation: srgb; color-interpolation-filters: linearrgb; color-rendering: auto; cursor: text; direction: ltr; display: block; dominant-baseline: auto; empty-cells: show; fill: #000000; fill-opacity: 1; fill-rule: nonzero; filter: none; float: right; flood-color: #000000; flood-opacity: 1; font-family: Calibri, sans-serif; font-size: 16px; font-style: normal; font-variant: normal; font-weight: normal; glyph-orientation-horizontal: 0deg; glyph-orientation-vertical: auto; height: 270px; image-rendering: auto; kerning: 0px; left: auto; letter-spacing: normal; lighting-color: #ffffff; line-height: normal; list-style: disc outside none; margin: 0px; marker-end: none; marker-mid: none; marker-start: none; mask: none; mask-type: luminance; max-height: none; max-width: none; min-height: 0px; min-width: 0px; opacity: 1; orphans: 2; outline: rgb(0, 0, 0) none 0px; overflow-wrap: break-word; overflow: visible; padding: 1px 0px 0px 1%; page-break-after: auto; page-break-before: auto; page-break-inside: auto; pointer-events: auto; position: static; resize: none; right: auto; shape-rendering: auto; speak: normal; stop-color: #000000; stop-opacity: 1; stroke: none; stroke-dasharray: none; stroke-dashoffset: 0px; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 4; stroke-opacity: 1; stroke-width: 1px; tab-size: 8; table-layout: auto; text-align: start; text-anchor: start; text-decoration: none; text-indent: 0px; text-overflow: clip; text-rendering: auto; text-shadow: none; text-transform: none; top: auto; unicode-bidi: normal; vector-effect: none; vertical-align: baseline; visibility: visible; white-space: normal; widows: 2; width: 18%; word-break: normal; word-spacing: 0px; word-wrap: break-word; writing-mode: lr-tb; z-index: auto; zoom: 1; background-position: 0% 0%; background-repeat: repeat repeat;"><img src="http://i.imgur.com/H1MJk.png" id="imguploadimage" onclick="jQuery(this).next().hide();jQuery(this).hide()" style="cursor: pointer !important; float: right; display: none;" /><iframe name="fuploadimage" scrolling="no" allowtransparency="true" frameborder="0" style="display: none; width: 248px; height: 204px;"></iframe>Nota: Descreva cores para textos, fundos, imagens, adicione logo ou icones que deseja na skin. Adicione também o tamanho da largura da skin ou qualquer outra informação adicional.
</div><fieldset class="fields1"><dl><dd></dd></dl></fieldset><input type="hidden" name="subject" /><input type="hidden" name="message" /><input type="hidden" name="mode" value="newtopic" /><input type="hidden" name="f" value="34" /><input type="hidden" name="lt" value="0" /><span class="corners-bottom"><span></span></span>
</div>
</div>
<div id="sthd" style="margin:0px">
</div><br />
<div id="bts" style="" class="panel">
<div class="inner"><span class="corners-top"><span></span></span><fieldset class="submit-buttons"><input id="bt-pr-questao" value="Pré-visualizar" type="button" class="button1" /><input id="bt-enviar" value="Enviar pedido" type="button" class="button1" name="post" /><input id="bt-apagar" value="Apagar tudo" type="button" class="button1" /><input id="bt-enviar-e" value="Enviar pedido" type="submit" class="button1" style="display:none;" name="post" /></fieldset><span class="corners-bottom"><span></span></span>
</div>
</div>
</form><br />
<div id="enviado" style="display:none;" class="panel">
<div class="inner"><span class="corners-top"><span></span></span>
<center><img src="http://2img.net/i/fa/admin/wait_preview.gif" alt="carregando" title="enviando..." /><br /><span class="conteudo_texto">enviando...</span>
</center><span class="corners-bottom"><span></span></span>
</div><script>
function bbcode_tag(o,c){
var t=jQuery('#text_editor_textarea');t.val(t.val().substring(0,t[0].selectionStart)+o+t.val().substring(t[0].selectionStart,t[0].selectionEnd)+c+t.val().s
});</script>
</div>
http://mundodosforuns.forum-pro.net/ PunBB
Convidado- Convidado
Página 1 de 1
Permissões neste sub-fórum
Não podes responder a tópicos
|
|