Personalizzazione form

[Silvio Trisorio]

Ciao a tutti,
ho creato dei moduli personalizzati con dei form tipo questo:

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.pack.js"></script>

       
        <div align="center">
          <select id="cerca_promo">
          <option name="# ">Cerca paese</option>           
<option name="http://www.google.it ">ISOLA SANT'ANTONIO</option>           
          </select>
         
         
         
         
          <script type="text/javascript">

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-3223941-55']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();

        </script>
</div>
        <script type="text/javascript">
$('#cerca_promo').change(function () {
    window.location = $(':selected', this).attr('name');
    });

        </script>

Vorrei però renderli più belli, magari con selettori arrotondati e così via...come posso fare a personalizzarli?

Grazie in anticipo.

Silvio.

[pupito]

Ciao, sarebbe meglio un link del sito. Comunque in linea di massima dovresti agire sul codicei css

[Silvio Trisorio]

Ciao,
non è possibile dare le variabili nel codice che ho scritto?

[danielecr]

Si, puoi inserire gli style direttamente inline, ma secondo me è più ordinato nel file separato css.

[Silvio Trisorio]

Quali sono i valori che devo inserire nel css?

[danielecr]

[/size][/font]

Vorrei però renderli più belli, magari con selettori arrotondati e così via...come posso fare a personalizzarli?

Dovresti essere più preciso!

[Silvio Trisorio]

Ok,
cosa ci scrivo nel css?

[danielecr]

Nel css o negli stili inline si scrivono appunto gli stili, ovvero le regole estetiche.
Non so in particolare cosa puoi scrivere, perchè non so come vuoi far apparire il form!

Qui hai un esempio generale con stili inline:

Codice: [Seleziona]

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.pack.js"></script>
<div align="center">
    <select id="cerca_promo" style="background-color:#F96; border-radius:8px;">
        <option name="# " style="font-size:14px; font-weight:bolder; background-color:#FC0;">Cerca paese</option>           
        <option name="http://www.google.it " style="background-color:#FC0;">ISOLA SANT'ANTONIO</option>           
    </select>
         
    <script type="text/javascript">
          var _gaq = _gaq || [];
          _gaq.push(['_setAccount', 'UA-3223941-55']);
          _gaq.push(['_trackPageview']);

          (function() {
        var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
        ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
        var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
          })();
    </script>
</div>

<script type="text/javascript">
$('#cerca_promo').change(function () {
    window.location = $(':selected', this).attr('name');
    });
</script>

Puoi modificare la grandezza del testo, lo stile del testo, i colori, l'arrotondamento e tutto quello che ti viene in mente..

Allego anche 2 screenshot, id1 relativo al tuo codice, id2 a quello modificato.

[giusebos]

la cosa migliore è postare il link, in maniera da darti istruzioni precise.
Con solo il codice js che richiama il form non ci si fa niente, occorre invece HTML.

In questi casi, avendo la pagina a disposizione, si analizza gli elementi con firebug, così chè possiamo darti una istruzione precisa da incollare nel file del CSS principale del sito.

Se invece, ad esempio, ti bastasse la regola che arrontonda gli angoli e magari abbia un bordo rosso:

tua_classe {
border-radius: 4px;
border: 1px solid #e40000;
}

[Silvio Trisorio]

Ciao scusa il ritardo,
ecco la pagina  "Seleziona il tuo paese"  cerca centro, vorrei renderlo un pò più carino.

Grazie mille.

[Sitiwebjoomla.it]

Se non sai usare il css ti conviene usare un modulo che gestisca i form come ad esempio cronoform oppure altri