We are looking to replicate the CSS look of the following page for some of our forms: [login to view URL]
Specifically we are looking for:
- CSS/images to convert our html forms into something close to the above form experience
- Work in all modern browsers and also on ipads/iphones/android devices
Features required:
- Large fields, easy to read
- The form name (see "pretext" span) should appear in the field itself and disappear when the user types into the field
- The success/warning/suggestion message should appear to the right of its corresponding field (see "posttext" span)
- The field in focus should be highlighted (note the blue halo effect) and the inside name should dim until they begin typing, then as mentioned above, it should then disappear.
- The CSS class names must be relatively unique, this form will be injected into a third party site using jsonp, so it must not affect their existing CSS
- The CSS must handle different form variations, such as necessary vs optional fields (this class is already set). There are also up to 4 custom fields, so the size of the form can vary.
- Custom form fields can have quite long pretext, so potentially it is not possible to put the text into the form field, but instead these could be treated differently and sit above the form field itself.
Background:
We have an API generating a form, which is designed to be injected into 3rd party sites (so users can submit this information back to our database from any URL). The form ID is dynamically generated and should not be used for any CSS. We're happy to change the html if required. We can also do all form validation and AJAX, so this job is specifically about generating CSS and suggesting html modifications to achieve the desired result.
I am having an experience of 10yrs in a product bassed company in the field of web application development with expertise in HTML, Javascript, AJAX, CSS, XML, Web services. I have currently ventured into Android development. You can be rest assured that you will never be disappointed with my service.