A contact form with special inputs to launch the appropriate keypad on mobile devices.
This web page contains two versions of the form - one for mobile devices and one for personal computers. Media queries are used to hide one and show the other in the appropriate situation. The different versions are required for the date picker.
If you are viewing this page on a personal computer, grab the browser window by the right hand edge and drag it to the left to reduce its width. You will see the form style change from “desktop style” to “mobile” although, obviously, the mobile inputs won't work for you!
The images below show the various keypads that are launched for the different input types and the date pickers on both mobile devices and personal computers.
© Roddy McKay - 2013