Eccoci, il momento è arrivato.
E’ ora di usare seriamente le SVG, perchè sono fighissime e la nuova ondata di material e flat design, ci calza proprio a pennello.
Eccoci, il momento è arrivato.
E’ ora di usare seriamente le SVG, perchè sono fighissime e la nuova ondata di material e flat design, ci calza proprio a pennello.
Spesso capita, per chi fa il mio mestiere, di imbattersi in problemi pratici e non saperne uscire senza un paio di imprecazioni e pugni sulla tastiera.
Continue reading
Sul sito di Gianni Favilli (www.giannifavilli.it) hotrovatoquesto script in jQuery comodo per nascondere il pulsante “submit” quando di preme, per evitare che l’utente lo prema più volte.
Ecco lo script da inserire nell'<head>:
/* inizio javascript */ <script type="text/javascript">// <![CDATA[ $(document).ready(function(){ $('#loading').hide(); // la pagina viene caricata con il div id 'loading' nascosto $('#bottoneinvia').click(function() { // al click sul bottone applica la segunete funzione $('#bottoneinvia').hide(); // nasconde il bottone invia $('#loading').show(); // visualizza il div 'loading' $('#form').submit(); // elabora il form }); }); // ]]></script> /* fine javascript */
E questo nell’HTML
<!-- inizio del form con ID 'form' --></pre> <form id="form" action="#" method="post" name="form"> < label for="label01">label01 <input id="label01" type="text" name="label01" value="" /> <label for="label02">label02</label> <input id="label02" type="text" name="label02" value="" /> <label for="label03">label03</label> <textarea id="label03" name="label03"></textarea> <!-- paragrafo con all'interno il bottone di invio --> <input id="button" type="submit" name="button" value="Submit" /> < !-- fine paragrafo --></form> <pre> <!-- fine form --> <!-- div con all'inerno un titolo e un immagine di attesa --></pre> <div id="loading"> <h3>Please Wait...</h3> <img src="loader.gif" alt="" /></div> <pre> <!-- fine del div -->
e nel CSS
#loading { display:none; position:fixed; left:0; top:0; width:100%; height:100%; background-image:url("transparentbg.png"); }
Dove transparentbg.png è un immagine con una trasparenza (o alpha) dell’80% (o come più vi piace) della grandezza di 25px per 25px.