Archivi per la categoria ‘Programmazione’

HTML5 ha introdotto una serie di nuovi tipi di input, uno dei quali è il tipo “number” che, appunto, è un campo di modulo che accetta input numerici. Che cosa succede in Google Chrome con il seguente codice HTML, quando cerchiamo di entrare in un (a virgola mobile) decimale numero e inviare il modulo?

<input type="number" />

Su Firefox ad esempio non succede. Si tratta quindi di un bug? No, il campo di modulo si comporta come definito dal W3C.

I nuovi campi input di tipo “number” possono avere gli ulteriori attributi “min” e “step”, limitando l’intervallo dei valori consentiti.
L’attributo “min” è abbastanza ovvio: è il valore minimo che può essere inserito.
L’attributo “step” è meno intuitivo: esso è il passo e controlla l’incremento/ decremento quando si clicca sui tastini su / giù del campo di input.
Tuttavia, l’attributo step determina anche che i valori sono validi, quindi ad esempio con un step=’1′ sarà possibile inserire valori 1, 2, 3 ecc e con step=2 significa che è possibile immettere 2, 4, 6, ecc, ma inserendo numeri tipo 3 o 5 verrà segnalato un errore di convalida, poiche sono valori non previsti dal passo.
È inoltre possibile utilizzare un valore decimale: ad esempio, un passo di 0.3 permetterà valori come 0.3, 0.6, 0.9, ecc, ma non 1 o 2.
Ma se è vostra intenzione far accettare tutti i numeri che siano interi o decimali, vi basterà inizializzare l’attributo step=’any’:

<input type="number" step="any"/>

In questo modo risolverete anche il messaggio d’errore mostrato sopra!

Ultimamente ho migrato un mio sito web da linux a windows. Le prestazioni MySql si sono rivelate davvero deludenti, anche una semplice query di SELECT in una tabella di poche decine di righe impiegava quasi 10 secondi per essere eseguita!
Dopo aver provato invano ad aumentare la memoria e a disattivare la cache dell’hard disk, ho constatato che il problema è causato dalla gestione IPv6 delle ultime versioni di Windows (7, server 2008 e affini).
Come ho risolto? Nella connessione al db (mysql_connect) ho sostituito localhost con 127.0.0.1
Appena sostituito i tempi di risposta sono diventati molto più accettabili.
Se vi è capitato anche a voi provate così e fatemi sapere.
Alla prossima!

Vi faccio presente un utilizzo dei css per personalizzare a nostro piacimento il tag title. Cercando su internet la maggior parte dei tutorial mostrano come creare un “effetto title” per meglio dire, che utilizza un elemento nascosto che al passaggio del mouse diventa visibile.
Come metodo l’ho trovato sì utile, ma sporco. Sono dell’opinione che se vogliamo il title, dobbiamo usare il title.

Questo è lo stile per la classe stile_title:

.stile_title {
position: relative;
}

.stile_title[data]:hover:after {
font-size: 15px;
content: attr(data);
padding: 4px 8px;
color: #333;
position: absolute;
left: 10px;
top: 10px;
white-space: nowrap;
z-index: 20;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
-moz-box-shadow: 0px 0px 4px #222;
-webkit-box-shadow: 0px 0px 4px #222;
box-shadow: 0px 0px 4px #222;
background-color: #eeeeee;
background-image: -moz-linear-gradient(top, #eeeeee, #ffffff);
background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #eeeeee),color-stop(1, #ffffff));
background-image: -webkit-linear-gradient(top, #eeeeee, #ffffff);
background-image: -moz-linear-gradient(top, #eeeeee, #ffffff);
background-image: -ms-linear-gradient(top, #eeeeee, #ffffff);
background-image: -o-linear-gradient(top, #eeeeee, #ffffff);
}

Unica annotazione:
Ho utilizzato il testo che sarà contenuto nell’attributo data piuttosto che title, poiche qualora passassimo il mouse su un elemento personalizzato con questa classe, avremmo un doppio tag title: il nostro personalizzato più quello del browser. Così facendo invece tutto funzionerà come ci aspettiamo.
scriveremo quindi: <div class="stile_title" data="Questo sarà il testo visualizzato"

Qui trovate l’esempio con tutto quello che vi ho scritto:
DEMO