Fórum dos Fóruns

Fórum dos Fóruns Forumeiros

Welcome FdF Bem-vindo ao fórum de suporte Forumeiros  Muito feliz


Para aproveitar tudo o que o nosso fórum lhe oferece, agradecemos que se identifique, se já é nosso membro, ou que se junte à nossa comunidade, fazendo o seu registo.
Acesso rápido

Fóruns de suporte oficiais


Meriteiro

Outubro de 2016



"Este membro destacou-se pela sua dedicação e pelo seu esforço.
Ao longo do último mês, demonstrou as suas capacidades gerais no FDF e, por isso, merece o nosso agradecimento."
Login

Esqueci minha senha

Últimos assuntos
Perdi minha senha!
Obter senha

Nota: use se tiver perdido acesso ao seu painel de controle.

Últimas sugestões
Parceiros Forumeiros
Quem está conectado
71 usuários online :: Nenhum usuário registrado, Nenhum Invisível e 71 Visitantes :: 1 Motor de busca

Nenhum

[ Ver toda a lista ]


O recorde de usuários online foi de 3131 em Qui 24 Dez 2009 - 15:05

Mudar pre-visualização do formulário

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

Em curso Mudar pre-visualização do formulário

Mensagem por YouTube3 em Ter 22 Nov 2016 - 17:45

Detalhes da questão


Endereço do fórum: http://vgnfamily.forumais.com
Versão do fórum: PunBB

Descrição


Boa tarde,

Então queria saber se é possível, mudar o sistema de pre-visualização do formulário? Ele está assim:



Código:
Código:
<style>
#content-container div#right  {
float: right;
overflow: hidden;
width: 0px!important;
display:none!important;
}
#content-container div#content {
margin-right: 0px;
}
  #form-send, .form-info h3 {
  background: #fcfcfc;
  border: 1px solid #ddd;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  border-radius: 2px;
  }
  #form-send select, .form-info h3 {
  font: 16px bold arial, tahoma, georgia;
  }
  .form-info h3 {padding: 3px;font-weight: bold;text-align: center;}
  #form-send select {
  min-width: 150px;
  padding: 4px;
  cursor: pointer;
  outline: none;
  border: 1px solid #e0e0e0;
  background: white;
  }
.warn{background:rgba(254,169,0,0.43) url(https://i55.servimg.com/u/f55/18/71/50/00/highli10.png) repeat-x 0 0;border:1px solid rgba(214,146,0,0.5);border-radius:20px;margin:3px 0;padding:8px;text-align:center}
  fieldset.form-div dt {
  padding: 5px 0;
  }
  fieldset.form-div dt {
  float: left;
  font: 15px bold arial, tahoma, georgia;
  width: 13em;
  }
  fieldset.form-div dd {
  margin-left: 10em;
  }
  fieldset.form-div dl:nth-child(odd) {
  background: #f5f8fa !important;
  }
  fieldset.form-div dl:nth-child(even) {
  background: #fff;
  }
  fieldset.form-div input {
  -moz-border-radius: 1px;
  -webkit-border-radius: 1px;
  border-radius: 1px;
  outline: none;
  border: 1px solid #e0e0e0;
  padding: 5px;
  }
  #countitle {
  background: white;
  color: #D60B8C;
  border: 0px solid #e0e0e0;
  padding: 5px;
  border-radius: 3px;
  }
  fieldset.form-div dl {padding: 11px;border-bottom: 1px solid #F3F3F3;}
  fieldset.form-div dl:after {
  clear: both;
  content: '.';
  display: block;
  height: 0px;
  visibility: hidden;
  }
  #form-send .area .buttons {
  -moz-background-clip: padding;
  -moz-border-radius: 3px 3px 0 0;
  -moz-user-select: none;
  -ms-user-select: none;
  -webkit-background-clip: padding-box;
  -webkit-border-radius: 3px 3px 0 0;
  -webkit-user-select: none;
  background: #f7f7f7;
  background-clip: padding-box;
  border: 1px solid silver;
  border-radius: 3px 3px 0 0;
  line-height: 0;
  width: 100%;
  overflow: hidden;
  padding: 3px 5px 2px;
  }
  #form-send .area1 {
  display: inline-block;
  min-height: 330px;
  z-index: 3;
  width: 63%;
  }
  #form-send .description {
  display: inline-block;
  z-index: 3;
  min-height: 200px;
  position: absolute;
  background: white;
  margin: 0 0 0 20px;
  line-height: 18px;
  color: #000000;
  font-family: Calibri, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-variant: normal;
  font-weight: normal;
  padding: 1em;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  border: 1px solid silver;
  width: 17%;
  }
  #form-send .area .buttons .button2 {
  background: white;
  cursor: pointer;
  outline: none;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  border: 1px solid #e0e0e0;
  padding: 3px;
  }
  #form-send .area .buttons .button2:hover {border-color: #707070;}
  #form-send .textarea_nc1 #textarea {
  min-height: 200px;
  color: #111;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 13px;
  overflow: auto;
  border: 0;
  outline: none;
  width: 100%;
  }
  #form-send .btns {
  background: #f5f5f5;
  border-top: 1px solid #d7d7d7;
  padding: 10px;
  text-align: center;
  }
  #form-send .area .textarea_nc1 {
  background: white;
  min-height: 200px;
  cursor: se-resize;
  -moz-border-radius: 0 0 3px 3px;
  -webkit-border-radius: 0 0 3px 3px;
  border-radius: 0 0 3px 3px;
  overflow: hidden;
  padding: 3px 5px 2px;
  border: 1px solid silver;
  border-top: 0;
  width: 100%;
  }
  #pr-modal {
  position: fixed;
  background-color: #3e3e3e;
  height: 100%;
  width: 100%;
  top: 0px;
  left: 0px;
  z-index: 100;
  opacity: 0.5;
  }
  #pr-questao {
  background-color: #464646;
  background-color: rgba(70, 70, 70, 0.6);
  padding: 4px;
  -webkit-box-shadow: 0px 12px 25px rgba(0, 0, 0, 0.7);
  -moz-box-shadow: 0px 12px 25px rgba(0, 0, 0, 0.7);
  box-shadow: 0px 12px 25px rgba(0, 0, 0, 0.7 );
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  position: absolute;
  z-index: 101;
  width: 70%;
  left: 14.5%;
  top: 50%;
  margin-top: -58px;
  }
  #pr-questao .postm {
  background: #fff;
  border: 1px solid #eee;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  border-radius: 2px;
  }
  #pr-questao .pr-clo {
  background: url(http://i.imgur.com/qRr3WvV.png) no-repeat;
  cursor: pointer;
  height: 16px;
  width: 16px;
  float: right;
  }
</style>
<script>
  $(document).ready(function() {
  $('#send').click(function() {
  if($('#seunome').val()!=='' &&  $('#tema').val()!=='' && $('#tipodearte').val()!=='' && $('#textarea').val()!=='') {
    var seunome = $('#seunome').val();
  var tema = $('#tema').val();
    var tipodearte = $('#tipodearte').val();
    var texto = $('#textarea').val();  
    var d = new Date();        //timestamp
    var da = d.getDate();      //day
    var mon = d.getMonth() + 1; //month
    var yr = d.getFullYear();  //year
    var dData = da + '/' + mon + '/' + yr;
  data = '['+dData+'] ';
  pedido = '(PEDIDO) - ';
    final = '[b]Seu nome:[/b] '+seunome+'\n [b]Tipo de Arte: [/b]'+tipodearte+'\n [b]Tema:[/b] '+tema+'\n[hr]\n[b]Sugestões: (opcional):[/b] '+texto+'';
    $('input[name="subject"]').val(data + pedido + seunome);
    $('input[name="message"]').val(final);
    $('#send2').click();
    $('#form-send').slideUp(300);
    $('#enviando').slideDown(500);
  }
  else {
    $('.alert').slideUp(1);
    $('.alert').slideDown(500);
  }
  });
  $('#prevquestion').click(function() {
    var seunome = $('#seunome').val();
    var tipodearte = $('#tipodearte').val();
    var texto = $('#textarea').val();
  final = '<b>Seu nome:</b><br />'+seunome+'<br /><b>Tipo de Arte: </b><br />'+tipodearte+'<br /><b>Tema:</b><br />'+tema+'<br /><hr /><br /><b>Sugestões: (opcional):</b><br /><blockquote>'+texto+'</blockquote>';
    $('#pr-modal').fadeIn(300);
    $('#pr-questao').slideDown(500);
    $('#pr-questao .entry-content').html(final);
  });
  $('.pr-clo').click(function() {
    $('#pr-modal').fadeOut(800);
    $('#pr-questao').slideUp(500);
  });
  $('#apagar-td').click(function() {
          $('#form-send input[type="text"],#form-send textarea').val('');
  });
  $('#seunome').keyup(function() {
    var tvalue = document.getElementById('seunome').value.length;
    var icnt = document.getElementById('countitle');
    if(tvalue < 10 && tvalue > 0) {
      var l = tvalue-10;
      icnt.innerHTML='O título necessita mais '+l*-1+' caracteres';
    }
    else {
      icnt.innerHTML='';
    }
  });
  });
</script>
  <div id="pr-modal" style="display: none;"></div>
  <div id="pr-questao" style="display: none;">
      <span class="pr-clo"></span>
      <div class="postm">
        <div class="post-entry">
        <div class="entry-content"></div>
        </div>
      </div>
  <br>
  </div>
  <div class="warn">
    <img style="width: 15px; height: 15px;" src="http://i.imgur.com/X7itW9j.png" /> <strong>Nota:</strong> Antes de postar, <a href="/search"><strong>pesquise no fórum</strong></a> para evitar tópicos repetidos!
  </div>
<form action="/post" method="post" name="post" id="form-send" enctype="multipart/form-data">
  <fieldset class="form-div">
  <dl><dt>
  <label>Seu nome:</label></dt>
  <dd>
    <input type="text" style="clear: both;width: 400px;" id="seunome" placeholder="Nick/Nome" class="inputbox"><br> <div id="countitle" style="display:n"></div>
  </dd>
  </dl> <dl>
  <dt>
  <label>Tipo de arte:</label></dt>
    <dd>
      <select class="inputbox" id="tipodearte" style="clear: both;width: 100px;">
      <option value="Avatar">Avatar</option>
      <option value="Sign">Sign</option>
      <option value="Fanbar">Fanbar</option>
      <option value="Avatar+Sign">Avatar+Sign</option>
      </select>
    </dd>
  </dl>
  <dl><dt>
  <label>Tema:</label></dt>
  <dd>
    <input type="text" style="clear: both;width: 400px;" id="tema" style="clear: both;width: 400px;" placeholder="Ex:Naruto" class="inputbox">
    
  </dd>
  </dl>
    <dl><dt>
        <label>Sugestões: (opcional)</label></dt>
        <dd>
          
                <input id="textarea"  style="clear: both;width: 400px;" class="inputbox" placeholder="Sugestões para seu pedido" ></input>
              
        </dd>
    </dl>
  </fieldset><div class="btns">
    <input type="hidden" name="subject" value="(Pedido) ">
    <input type="hidden" name="message">
    <input type="hidden" name="mode" value="newtopic">
    <input type="hidden" name="f" value="10">
    <input type="hidden" name="lt" value="0">
    <input type="button" value="Enviar" id="send" name="post"> <input type="button" value="Pré-visualizar" id="prevquestion"> <input type="button" value="Apagar tudo" id="apagar-td">
    <input type="submit" style="display: none;" id="send2" name="post">
</div>
</form><div id="enviando" style="display:none;">
  <center>
  <img src="http://illiweb.com/fa/admin/wait_preview.gif" alt="carregando" title="enviando..."><br>
  <span class="conteudo_texto">enviando...</span>
  </center>
</div>

Espero que entenda até mais.

YouTube3
Usuário destaque

Masculino
Inscrito dia : 04/01/2015
Mensagens : 861
Pontos Ativos : 1925

http://Ajuda.Forumeiros.com

Em curso Re: Mudar pre-visualização do formulário

Mensagem por YouTube3 em Qua 23 Nov 2016 - 23:27

UP

YouTube3
Usuário destaque

Masculino
Inscrito dia : 04/01/2015
Mensagens : 861
Pontos Ativos : 1925

http://Ajuda.Forumeiros.com

Em curso Re: Mudar pre-visualização do formulário

Mensagem por YouTube3 em Sab 26 Nov 2016 - 0:27

UP

YouTube3
Usuário destaque

Masculino
Inscrito dia : 04/01/2015
Mensagens : 861
Pontos Ativos : 1925

http://Ajuda.Forumeiros.com
  • 0

Em curso Re: Mudar pre-visualização do formulário

Mensagem por Sennior em Sab 26 Nov 2016 - 9:16

Boas!

E como deseja essa pre-visualização?
Até mais.
Sennior


Admineiros Jamais forneça seus dados pessoais, tais como e-mail de fundação ou senhas pelo fórum!
Admineiros  Antes de criar um novo tópico faça uma pesquisa rápida e olhe a lista de tutoriais prontos.
Admineiros Perdeu a senha de administração? Veja o que fazer.
Admineiros Ferramentas do Administrador.

"Você será lembrado pelo que faz, e não pela cor que tens".

Sennior
Admineiro
Admineiro

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16227
Pontos Ativos : 22712

http://ajuda.forumeiros.com/forum https://www.facebook.com/GlladstonHenrique

Em curso Re: Mudar pre-visualização do formulário

Mensagem por YouTube3 em Sab 26 Nov 2016 - 13:57

Bom, eu também assim não tenho algo especifico no último tópico o Kyo Panda, tinha me pedido apenas fonte, cores, espaçamentos, etc.. cor: preta - Fonte: Sans-Serif - Espaçamento: 2 espaço.

Se eu tivesse algo eu botaria aqui no tópico de exemplo sabe? mas não achei nada do tipo. Triste

YouTube3
Usuário destaque

Masculino
Inscrito dia : 04/01/2015
Mensagens : 861
Pontos Ativos : 1925

http://Ajuda.Forumeiros.com

Em curso Re: Mudar pre-visualização do formulário

Mensagem por YouTube3 em Dom 27 Nov 2016 - 23:01

UP

YouTube3
Usuário destaque

Masculino
Inscrito dia : 04/01/2015
Mensagens : 861
Pontos Ativos : 1925

http://Ajuda.Forumeiros.com

Em curso Re: Mudar pre-visualização do formulário

Mensagem por YouTube3 em Qua 30 Nov 2016 - 0:36

UP

YouTube3
Usuário destaque

Masculino
Inscrito dia : 04/01/2015
Mensagens : 861
Pontos Ativos : 1925

http://Ajuda.Forumeiros.com
  • 0

Em curso Re: Mudar pre-visualização do formulário

Mensagem por Kyo Panda em Qui 1 Dez 2016 - 1:54

@YouTube3 escreveu:[...]cor: preta - Fonte: Sans-Serif - Espaçamento: 2 espaço.

Vendo a captura de tela que passou, parece-me já estar dessa forma. Poderia apontar qual parte do texto gostaria de aplicar essa formatação? Contente

Kyo Panda
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 08/01/2012
Mensagens : 1434
Pontos Ativos : 3970

http://ajuda.forumeiros.com

Em curso Re: Mudar pre-visualização do formulário

Mensagem por YouTube3 em Qui 1 Dez 2016 - 18:14

No caso assim.

Seu nome: tioza0h_Vengeance   -   Tipo de Arte: Avatar+Sign

Tema: Snoop Dogg   -   Sugestões: (Opcional): GFX.

Apenas na pre-visualização no tópico deixar como está. Feliz
O Resto pode deixar normal quero mudar mesmo é a pre-visualização do formulário.
Deixar ele com outro aparência etc.. vou procurar caso eu achar algo do tipo eu edito o tópico.

YouTube3
Usuário destaque

Masculino
Inscrito dia : 04/01/2015
Mensagens : 861
Pontos Ativos : 1925

http://Ajuda.Forumeiros.com

Em curso Re: Mudar pre-visualização do formulário

Mensagem por YouTube3 em Sab 3 Dez 2016 - 4:00

up

YouTube3
Usuário destaque

Masculino
Inscrito dia : 04/01/2015
Mensagens : 861
Pontos Ativos : 1925

http://Ajuda.Forumeiros.com
  • 0

Em curso Re: Mudar pre-visualização do formulário

Mensagem por Kyo Panda em Sab 3 Dez 2016 - 22:15

Tente trocar o código do formulário por esse. Feliz

Código:
<style>
    #content-container div#right {
        float: right;
        overflow: hidden;
        width: 0px!important;
        display: none!important;
    }
   
    #content-container div#content {
        margin-right: 0px;
    }
   
    #form-send,
    .form-info h3 {
        background: #fcfcfc;
        border: 1px solid #ddd;
        -moz-border-radius: 2px;
        -webkit-border-radius: 2px;
        border-radius: 2px;
    }
   
    #form-send select,
    .form-info h3 {
        font: 16px bold arial, tahoma, georgia;
    }
   
    .form-info h3 {
        padding: 3px;
        font-weight: bold;
        text-align: center;
    }
   
    #form-send select {
        min-width: 150px;
        padding: 4px;
        cursor: pointer;
        outline: none;
        border: 1px solid #e0e0e0;
        background: white;
    }
   
    .warn {
        background: rgba(254, 169, 0, 0.43) url(https://i55.servimg.com/u/f55/18/71/50/00/highli10.png) repeat-x 0 0;
        border: 1px solid rgba(214, 146, 0, 0.5);
        border-radius: 20px;
        margin: 3px 0;
        padding: 8px;
        text-align: center
    }
   
    fieldset.form-div dt {
        padding: 5px 0;
    }
   
    fieldset.form-div dt {
        float: left;
        font: 15px bold arial, tahoma, georgia;
        width: 13em;
    }
   
    fieldset.form-div dd {
        margin-left: 10em;
    }
   
    fieldset.form-div dl:nth-child(odd) {
        background: #f5f8fa !important;
    }
   
    fieldset.form-div dl:nth-child(even) {
        background: #fff;
    }
   
    fieldset.form-div input {
        -moz-border-radius: 1px;
        -webkit-border-radius: 1px;
        border-radius: 1px;
        outline: none;
        border: 1px solid #e0e0e0;
        padding: 5px;
    }
   
    #countitle {
        background: white;
        color: #D60B8C;
        border: 0px solid #e0e0e0;
        padding: 5px;
        border-radius: 3px;
    }
   
    fieldset.form-div dl {
        padding: 11px;
        border-bottom: 1px solid #F3F3F3;
    }
   
    fieldset.form-div dl:after {
        clear: both;
        content: '.';
        display: block;
        height: 0px;
        visibility: hidden;
    }
   
    #form-send .area .buttons {
        -moz-background-clip: padding;
        -moz-border-radius: 3px 3px 0 0;
        -moz-user-select: none;
        -ms-user-select: none;
        -webkit-background-clip: padding-box;
        -webkit-border-radius: 3px 3px 0 0;
        -webkit-user-select: none;
        background: #f7f7f7;
        background-clip: padding-box;
        border: 1px solid silver;
        border-radius: 3px 3px 0 0;
        line-height: 0;
        width: 100%;
        overflow: hidden;
        padding: 3px 5px 2px;
    }
   
    #form-send .area1 {
        display: inline-block;
        min-height: 330px;
        z-index: 3;
        width: 63%;
    }
   
    #form-send .description {
        display: inline-block;
        z-index: 3;
        min-height: 200px;
        position: absolute;
        background: white;
        margin: 0 0 0 20px;
        line-height: 18px;
        color: #000000;
        font-family: Calibri, sans-serif;
        font-size: 16px;
        font-style: normal;
        font-variant: normal;
        font-weight: normal;
        padding: 1em;
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px;
        border-radius: 3px;
        border: 1px solid silver;
        width: 17%;
    }
   
    #form-send .area .buttons .button2 {
        background: white;
        cursor: pointer;
        outline: none;
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px;
        border-radius: 3px;
        border: 1px solid #e0e0e0;
        padding: 3px;
    }
   
    #form-send .area .buttons .button2:hover {
        border-color: #707070;
    }
   
    #form-send .textarea_nc1 #textarea {
        min-height: 200px;
        color: #111;
        font-family: Verdana, Arial, Helvetica, sans-serif;
        font-size: 13px;
        overflow: auto;
        border: 0;
        outline: none;
        width: 100%;
    }
   
    #form-send .btns {
        background: #f5f5f5;
        border-top: 1px solid #d7d7d7;
        padding: 10px;
        text-align: center;
    }
   
    #form-send .area .textarea_nc1 {
        background: white;
        min-height: 200px;
        cursor: se-resize;
        -moz-border-radius: 0 0 3px 3px;
        -webkit-border-radius: 0 0 3px 3px;
        border-radius: 0 0 3px 3px;
        overflow: hidden;
        padding: 3px 5px 2px;
        border: 1px solid silver;
        border-top: 0;
        width: 100%;
    }
   
    #pr-modal {
        position: fixed;
        background-color: #3e3e3e;
        height: 100%;
        width: 100%;
        top: 0px;
        left: 0px;
        z-index: 100;
        opacity: 0.5;
    }
   
    #pr-questao {
        background-color: #464646;
        background-color: rgba(70, 70, 70, 0.6);
        padding: 4px;
        -webkit-box-shadow: 0px 12px 25px rgba(0, 0, 0, 0.7);
        -moz-box-shadow: 0px 12px 25px rgba(0, 0, 0, 0.7);
        box-shadow: 0px 12px 25px rgba(0, 0, 0, 0.7);
        -moz-border-radius: 4px;
        -webkit-border-radius: 4px;
        border-radius: 4px;
        position: absolute;
        z-index: 101;
        width: 70%;
        left: 14.5%;
        top: 50%;
        margin-top: -58px;
    }
   
    #pr-questao .postm {
        background: #fff;
        border: 1px solid #eee;
        -moz-border-radius: 2px;
        -webkit-border-radius: 2px;
        border-radius: 2px;
    }
   
    #pr-questao .pr-clo {
        background: url(http://i.imgur.com/qRr3WvV.png) no-repeat;
        cursor: pointer;
        height: 16px;
        width: 16px;
        float: right;
    }

    div#pr-questao .entry-content {
        padding: 30px;
        line-height: 30px;
        text-align: center;
    }
</style>
<script>
    $(document).ready(function () {

        $('#send').click(function () {

            if ($('#seunome').val() !== '' && $('#tema').val() !== '' && $('#tipodearte').val() !== '' && $('#textarea').val() !== '') {
                var seunome = $('#seunome').val();
                var tema = $('#tema').val();
                var tipodearte = $('#tipodearte').val();
                var texto = $('#textarea').val();
                var d = new Date();        //timestamp
                var da = d.getDate();      //day
                var mon = d.getMonth() + 1; //month
                var yr = d.getFullYear();  //year
                var dData = da + '/' + mon + '/' + yr;
                data = '[' + dData + '] ';
                pedido = '(PEDIDO) - ';
                final = '[b]Seu nome:[/b] ' + seunome + '\n [b]Tipo de Arte: [/b]' + tipodearte + '\n [b]Tema:[/b] ' + tema + '\n[hr]\n[b]Sugestões: (opcional):[/b] ' + texto + '';
                $('input[name="subject"]').val(data + pedido + seunome);
                $('input[name="message"]').val(final);
                $('#send2').click();
                $('#form-send').slideUp(300);
                $('#enviando').slideDown(500);
            }
            else {
                $('.alert').slideUp(1);
                $('.alert').slideDown(500);
            }
        });

        $('#prevquestion').click(function () {
            var seunome = $('#seunome').val();
            var tipodearte = $('#tipodearte').val();
            var texto = $('#textarea').val();
            var tema = $('#tema').val();
            final = '<b>Seu nome:</b> ' + seunome + '&nbsp;&nbsp;-&nbsp;&nbsp;<b>Tipo de Arte: </b> ' + tipodearte + '<br /><b>Tema:</b> ' + tema + '&nbsp;&nbsp;-&nbsp;&nbsp;<b>Sugestões: (opcional):</b>' + texto;
            $('#pr-modal').fadeIn(300);
            $('#pr-questao').slideDown(500);
            $('#pr-questao .entry-content').html(final);
        });

        $('.pr-clo').click(function () {
            $('#pr-modal').fadeOut(800);
            $('#pr-questao').slideUp(500);
        });

        $('#apagar-td').click(function () {
            $('#form-send input[type="text"],#form-send textarea').val('');
        });
       
        $('#seunome').keyup(function () {
            var tvalue = document.getElementById('seunome').value.length;
            var icnt = document.getElementById('countitle');
            if (tvalue < 10 && tvalue > 0) {
                var l = tvalue - 10;
                icnt.innerHTML = 'O título necessita mais ' + l * -1 + ' caracteres';
            }
            else {
                icnt.innerHTML = '';
            }
        });
    });
</script>
<div id="pr-modal" style="display: none;"></div>
<div id="pr-questao" style="display: none;">
    <span class="pr-clo"></span>
    <div class="postm">
        <div class="post-entry">
            <div class="entry-content"></div>
        </div>
    </div>
</div>
<div class="warn">
    <img style="width: 15px; height: 15px;" src="http://i.imgur.com/X7itW9j.png" />
    <strong>Nota:</strong> Antes de postar,
    <a href="/search"><strong>pesquise no fórum</strong></a> para evitar tópicos repetidos!
</div>
<form action="/post" method="post" name="post" id="form-send" enctype="multipart/form-data">
    <fieldset class="form-div">
        <dl>
            <dt>
                <label>Seu nome:</label>
            </dt>
            <dd>
                <input type="text" style="clear: both;width: 400px;" id="seunome" placeholder="Nick / Nome" class="inputbox" />
                <br />
                <div id="countitle" style="display: none;"></div>
            </dd>
        </dl>
        <dl>
            <dt>
                <label>Tipo de arte:</label>
            </dt>
            <dd>
                <select class="inputbox" id="tipodearte" style="clear: both; width: 100px;">
                    <option value="Avatar">Avatar</option>
                    <option value="Sign">Sign</option>
                    <option value="Fanbar">Fanbar</option>
                    <option value="Avatar+Sign">Avatar + Sign</option>
                </select>
            </dd>
        </dl>
        <dl>
            <dt>
                <label>Tema:</label>
            </dt>
            <dd>
                <input type="text" style="clear: both;width: 400px;" id="tema" style="clear: both;width: 400px;" placeholder="Ex:Naruto" class="inputbox" />
            </dd>
        </dl>
        <dl>
            <dt>
                <label>Sugestões: (opcional)</label>
            </dt>
            <dd>
                <input id="textarea" style="clear: both;width: 400px;" class="inputbox" placeholder="Sugestões para seu pedido" />
            </dd>
        </dl>
    </fieldset>
    <div class="btns">
        <input type="hidden" name="subject" value="(Pedido)" />
        <input type="hidden" name="message" />
        <input type="hidden" name="mode" value="newtopic" />
        <input type="hidden" name="f" value="10" />
        <input type="hidden" name="lt" value="0" />
        <input type="button" value="Enviar" id="send" name="post"> <input type="button" value="Pré-visualizar" id="prevquestion" />
        <input type="button" value="Apagar tudo" id="apagar-td" />
        <input type="submit" style="display: none;" id="send2" name="post" />
    </div>
</form>
<div id="enviando" style="display: none;">
    <center>
        <img src="http://illiweb.com/fa/admin/wait_preview.gif" alt="carregando" title="Enviando..." />
        <br />
        <span class="conteudo_texto">Enviando...</span>
    </center>
</div>

Kyo Panda
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 08/01/2012
Mensagens : 1434
Pontos Ativos : 3970

http://ajuda.forumeiros.com

Em curso Re: Mudar pre-visualização do formulário

Mensagem por YouTube3 em Dom 4 Dez 2016 - 1:09

Ficou bom, poderia dar um espaço depois do (opcional): ? que a "sign gfx" fica grudado na sugestão.



Agora teria como dar uma aparência, melhor no formulário? se for possível obrigado.

YouTube3
Usuário destaque

Masculino
Inscrito dia : 04/01/2015
Mensagens : 861
Pontos Ativos : 1925

http://Ajuda.Forumeiros.com
  • 0

Em curso Re: Mudar pre-visualização do formulário

Mensagem por Shek Crowley Ontem à(s) 15:49

É só dar um espaço antes do + texto; do seu código! Errado


Seta Respeite as Regras gerais do fórum e conheça a nossa equipa.
Seta Veja a Lista de FAQs do seu Painel e Lista de tutoriais
Seta Ferramentas do Administrador
Seta Assinalar um Litígio


Shek Crowley
Admineiro
Admineiro

Masculino
Inscrito dia : 11/04/2009
Mensagens : 15082
Pontos Ativos : 22274

http://www.shiftactif.com https://www.facebook.com/shek.crowley https://twitter.com/shek_forumactif

Em curso Re: Mudar pre-visualização do formulário

Mensagem por YouTube3 Ontem à(s) 16:18

Sim eu tentei fazer isso ontem mesmo porem não adianto. Feliz

YouTube3
Usuário destaque

Masculino
Inscrito dia : 04/01/2015
Mensagens : 861
Pontos Ativos : 1925

http://Ajuda.Forumeiros.com
  • 0

Em curso Re: Mudar pre-visualização do formulário

Mensagem por Shek Crowley Ontem à(s) 16:27

Coloca na caixa de busca da página HTML
Código:
+ texto;
Só existe um elemento no seu HTML com isso. Quando encontrar, ANTES é só apertar o espaço do teclado! Se não funcionar, antes ao invés do espaço, coloque o interprete:
Código:
\s

E Youtube, você já é um membro antigo no FDF, e acredito que saiba que não é permitido usar formatações nas mensagens. Isso dificulta a leitura de pessoas com problema de visão, e faz com que sua resposta demore mais! Por favor, evite-o, por gentileza.


Seta Respeite as Regras gerais do fórum e conheça a nossa equipa.
Seta Veja a Lista de FAQs do seu Painel e Lista de tutoriais
Seta Ferramentas do Administrador
Seta Assinalar um Litígio


Shek Crowley
Admineiro
Admineiro

Masculino
Inscrito dia : 11/04/2009
Mensagens : 15082
Pontos Ativos : 22274

http://www.shiftactif.com https://www.facebook.com/shek.crowley https://twitter.com/shek_forumactif

Em curso Re: Mudar pre-visualização do formulário

Mensagem por YouTube3 Ontem à(s) 18:46

Desculpe, coloquei certinho como pediu porem o botão de visualizar parou de funcionar.

YouTube3
Usuário destaque

Masculino
Inscrito dia : 04/01/2015
Mensagens : 861
Pontos Ativos : 1925

http://Ajuda.Forumeiros.com
  • 0

Em curso Re: Mudar pre-visualização do formulário

Mensagem por Kyo Panda Hoje à(s) 0:25

Tente trocar por esse:

Código:
<style>
    #content-container div#right {
        float: right;
        overflow: hidden;
        width: 0px!important;
        display: none!important;
    }
   
    #content-container div#content {
        margin-right: 0px;
    }
   
    #form-send,
    .form-info h3 {
        background: #fcfcfc;
        border: 1px solid #ddd;
        -moz-border-radius: 2px;
        -webkit-border-radius: 2px;
        border-radius: 2px;
    }
   
    #form-send select,
    .form-info h3 {
        font: 16px bold arial, tahoma, georgia;
    }
   
    .form-info h3 {
        padding: 3px;
        font-weight: bold;
        text-align: center;
    }
   
    #form-send select {
        min-width: 150px;
        padding: 4px;
        cursor: pointer;
        outline: none;
        border: 1px solid #e0e0e0;
        background: white;
    }
   
    .warn {
        background: rgba(254, 169, 0, 0.43) url(https://i55.servimg.com/u/f55/18/71/50/00/highli10.png) repeat-x 0 0;
        border: 1px solid rgba(214, 146, 0, 0.5);
        border-radius: 20px;
        margin: 3px 0;
        padding: 8px;
        text-align: center
    }
   
    fieldset.form-div dt {
        padding: 5px 0;
    }
   
    fieldset.form-div dt {
        float: left;
        font: 15px bold arial, tahoma, georgia;
        width: 13em;
    }
   
    fieldset.form-div dd {
        margin-left: 10em;
    }
   
    fieldset.form-div dl:nth-child(odd) {
        background: #f5f8fa !important;
    }
   
    fieldset.form-div dl:nth-child(even) {
        background: #fff;
    }
   
    fieldset.form-div input {
        -moz-border-radius: 1px;
        -webkit-border-radius: 1px;
        border-radius: 1px;
        outline: none;
        border: 1px solid #e0e0e0;
        padding: 5px;
    }
   
    #countitle {
        background: white;
        color: #D60B8C;
        border: 0px solid #e0e0e0;
        padding: 5px;
        border-radius: 3px;
    }
   
    fieldset.form-div dl {
        padding: 11px;
        border-bottom: 1px solid #F3F3F3;
    }
   
    fieldset.form-div dl:after {
        clear: both;
        content: '.';
        display: block;
        height: 0px;
        visibility: hidden;
    }
   
    #form-send .area .buttons {
        -moz-background-clip: padding;
        -moz-border-radius: 3px 3px 0 0;
        -moz-user-select: none;
        -ms-user-select: none;
        -webkit-background-clip: padding-box;
        -webkit-border-radius: 3px 3px 0 0;
        -webkit-user-select: none;
        background: #f7f7f7;
        background-clip: padding-box;
        border: 1px solid silver;
        border-radius: 3px 3px 0 0;
        line-height: 0;
        width: 100%;
        overflow: hidden;
        padding: 3px 5px 2px;
    }
   
    #form-send .area1 {
        display: inline-block;
        min-height: 330px;
        z-index: 3;
        width: 63%;
    }
   
    #form-send .description {
        display: inline-block;
        z-index: 3;
        min-height: 200px;
        position: absolute;
        background: white;
        margin: 0 0 0 20px;
        line-height: 18px;
        color: #000000;
        font-family: Calibri, sans-serif;
        font-size: 16px;
        font-style: normal;
        font-variant: normal;
        font-weight: normal;
        padding: 1em;
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px;
        border-radius: 3px;
        border: 1px solid silver;
        width: 17%;
    }
   
    #form-send .area .buttons .button2 {
        background: white;
        cursor: pointer;
        outline: none;
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px;
        border-radius: 3px;
        border: 1px solid #e0e0e0;
        padding: 3px;
    }
   
    #form-send .area .buttons .button2:hover {
        border-color: #707070;
    }
   
    #form-send .textarea_nc1 #textarea {
        min-height: 200px;
        color: #111;
        font-family: Verdana, Arial, Helvetica, sans-serif;
        font-size: 13px;
        overflow: auto;
        border: 0;
        outline: none;
        width: 100%;
    }
   
    #form-send .btns {
        background: #f5f5f5;
        border-top: 1px solid #d7d7d7;
        padding: 10px;
        text-align: center;
    }
   
    #form-send .area .textarea_nc1 {
        background: white;
        min-height: 200px;
        cursor: se-resize;
        -moz-border-radius: 0 0 3px 3px;
        -webkit-border-radius: 0 0 3px 3px;
        border-radius: 0 0 3px 3px;
        overflow: hidden;
        padding: 3px 5px 2px;
        border: 1px solid silver;
        border-top: 0;
        width: 100%;
    }
   
    #pr-modal {
        position: fixed;
        background-color: #3e3e3e;
        height: 100%;
        width: 100%;
        top: 0px;
        left: 0px;
        z-index: 100;
        opacity: 0.5;
    }
   
    #pr-questao {
        background-color: #464646;
        background-color: rgba(70, 70, 70, 0.6);
        padding: 4px;
        -webkit-box-shadow: 0px 12px 25px rgba(0, 0, 0, 0.7);
        -moz-box-shadow: 0px 12px 25px rgba(0, 0, 0, 0.7);
        box-shadow: 0px 12px 25px rgba(0, 0, 0, 0.7);
        -moz-border-radius: 4px;
        -webkit-border-radius: 4px;
        border-radius: 4px;
        position: absolute;
        z-index: 101;
        width: 70%;
        left: 14.5%;
        top: 50%;
        margin-top: -58px;
    }
   
    #pr-questao .postm {
        background: #fff;
        border: 1px solid #eee;
        -moz-border-radius: 2px;
        -webkit-border-radius: 2px;
        border-radius: 2px;
    }
   
    #pr-questao .pr-clo {
        background: url(http://i.imgur.com/qRr3WvV.png) no-repeat;
        cursor: pointer;
        height: 16px;
        width: 16px;
        float: right;
    }

    div#pr-questao .entry-content {
        padding: 30px;
        line-height: 30px;
        text-align: center;
    }
</style>
<script>
    $(document).ready(function () {

        $('#send').click(function () {

            if ($('#seunome').val() !== '' && $('#tema').val() !== '' && $('#tipodearte').val() !== '' && $('#textarea').val() !== '') {
                var seunome = $('#seunome').val();
                var tema = $('#tema').val();
                var tipodearte = $('#tipodearte').val();
                var texto = $('#textarea').val();
                var d = new Date();        //timestamp
                var da = d.getDate();      //day
                var mon = d.getMonth() + 1; //month
                var yr = d.getFullYear();  //year
                var dData = da + '/' + mon + '/' + yr;
                data = '[' + dData + '] ';
                pedido = '(PEDIDO) - ';
                final = '[b]Seu nome:[/b] ' + seunome + '\n [b]Tipo de Arte: [/b]' + tipodearte + '\n [b]Tema:[/b] ' + tema + '\n[hr]\n[b]Sugestões: (opcional):[/b] ' + texto + '';
                $('input[name="subject"]').val(data + pedido + seunome);
                $('input[name="message"]').val(final);
                $('#send2').click();
                $('#form-send').slideUp(300);
                $('#enviando').slideDown(500);
            }
            else {
                $('.alert').slideUp(1);
                $('.alert').slideDown(500);
            }
        });

        $('#prevquestion').click(function () {
            var seunome = $('#seunome').val();
            var tipodearte = $('#tipodearte').val();
            var texto = $('#textarea').val();
            var tema = $('#tema').val();
            final = '<b>Seu nome:</b> ' + seunome + '&nbsp;&nbsp;-&nbsp;&nbsp;<b>Tipo de Arte: </b> ' + tipodearte + '<br /><b>Tema:</b> ' + tema + '&nbsp;&nbsp;-&nbsp;&nbsp;<b>Sugestões: (opcional):&nbsp;&nbsp;</b>' + texto;
            $('#pr-modal').fadeIn(300);
            $('#pr-questao').slideDown(500);
            $('#pr-questao .entry-content').html(final);
        });

        $('.pr-clo').click(function () {
            $('#pr-modal').fadeOut(800);
            $('#pr-questao').slideUp(500);
        });

        $('#apagar-td').click(function () {
            $('#form-send input[type="text"],#form-send textarea').val('');
        });
       
        $('#seunome').keyup(function () {
            var tvalue = document.getElementById('seunome').value.length;
            var icnt = document.getElementById('countitle');
            if (tvalue < 10 && tvalue > 0) {
                var l = tvalue - 10;
                icnt.innerHTML = 'O título necessita mais ' + l * -1 + ' caracteres';
            }
            else {
                icnt.innerHTML = '';
            }
        });
    });
</script>
<div id="pr-modal" style="display: none;"></div>
<div id="pr-questao" style="display: none;">
    <span class="pr-clo"></span>
    <div class="postm">
        <div class="post-entry">
            <div class="entry-content"></div>
        </div>
    </div>
</div>
<div class="warn">
    <img style="width: 15px; height: 15px;" src="http://i.imgur.com/X7itW9j.png" />
    <strong>Nota:</strong> Antes de postar,
    <a href="/search"><strong>pesquise no fórum</strong></a> para evitar tópicos repetidos!
</div>
<form action="/post" method="post" name="post" id="form-send" enctype="multipart/form-data">
    <fieldset class="form-div">
        <dl>
            <dt>
                <label>Seu nome:</label>
            </dt>
            <dd>
                <input type="text" style="clear: both;width: 400px;" id="seunome" placeholder="Nick / Nome" class="inputbox" />
                <br />
                <div id="countitle" style="display: none;"></div>
            </dd>
        </dl>
        <dl>
            <dt>
                <label>Tipo de arte:</label>
            </dt>
            <dd>
                <select class="inputbox" id="tipodearte" style="clear: both; width: 100px;">
                    <option value="Avatar">Avatar</option>
                    <option value="Sign">Sign</option>
                    <option value="Fanbar">Fanbar</option>
                    <option value="Avatar+Sign">Avatar + Sign</option>
                </select>
            </dd>
        </dl>
        <dl>
            <dt>
                <label>Tema:</label>
            </dt>
            <dd>
                <input type="text" style="clear: both;width: 400px;" id="tema" style="clear: both;width: 400px;" placeholder="Ex:Naruto" class="inputbox" />
            </dd>
        </dl>
        <dl>
            <dt>
                <label>Sugestões: (opcional)</label>
            </dt>
            <dd>
                <input id="textarea" style="clear: both;width: 400px;" class="inputbox" placeholder="Sugestões para seu pedido" />
            </dd>
        </dl>
    </fieldset>
    <div class="btns">
        <input type="hidden" name="subject" value="(Pedido)" />
        <input type="hidden" name="message" />
        <input type="hidden" name="mode" value="newtopic" />
        <input type="hidden" name="f" value="10" />
        <input type="hidden" name="lt" value="0" />
        <input type="button" value="Enviar" id="send" name="post"> <input type="button" value="Pré-visualizar" id="prevquestion" />
        <input type="button" value="Apagar tudo" id="apagar-td" />
        <input type="submit" style="display: none;" id="send2" name="post" />
    </div>
</form>
<div id="enviando" style="display: none;">
    <center>
        <img src="http://illiweb.com/fa/admin/wait_preview.gif" alt="carregando" title="Enviando..." />
        <br />
        <span class="conteudo_texto">Enviando...</span>
    </center>
</div>

Agora "aparência melhor" terá que dar aquela direção. Programador é péssimo com design. >-<"

Kyo Panda
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 08/01/2012
Mensagens : 1434
Pontos Ativos : 3970

http://ajuda.forumeiros.com

Em curso Re: Mudar pre-visualização do formulário

Mensagem por YouTube3 Hoje à(s) 4:03

Deu certo.

Eu mesmo tentei fazer algo pelo photoshop, porem não consegui fazer nada.
Queria botar pré-visualização tipo um quote, com uma barra azul na esquerda.
Amanhã irei tentar fazer algo qualquer coisa se eu conseguir botarei no tópico até mais.

YouTube3
Usuário destaque

Masculino
Inscrito dia : 04/01/2015
Mensagens : 861
Pontos Ativos : 1925

http://Ajuda.Forumeiros.com

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo

- Tópicos similares

Permissão deste fórum:
Você não pode responder aos tópicos neste fórum
Fórum dos Fóruns - Ajuda mútua para usuários forumeiros
on
Fórum grátis: interajuda aos usuários forumeiros. Criar e administrar um fórum. Descubra nossos guias, tutoriais e astúcias no suporte de Forumeiros.
Votações: 5