Uncategorized

Gracefully degrade HTML5 “number” form elements

Use Modernizr to replace the a “number” INPUT element with an normal text box and two control buttons in older browsers:

if (!Modernizr.inputtypes.number) {
	document.write("<button type='button' onclick='number_field.value = parseInt(number_field.value) - 1'>-</button>");
	document.write(" <input type='text' size='10' id='number_field' value='0' /> ");
	document.write("<button type='button' onclick='number_field.value = parseInt(number_field.value) + 1'>+</button>");
} else {
	document.write("<input type='number' size='10' id='number_field' value='0' />");
}