Responsive HTML5 CSS 3 Single Web Page - jQuery HTML5 css3
I have a website that I would like implemented in HTML5, CSS3 and JQuery. It's only one page, with no database component. However, DETAILS: The site should use responsive web design techniques to accommodate wide-screen desktop and mobile users alike The code should validate perfectly to HTML5 and CSS3 using the W3C HTML and CSS validation tools. It should use features that work in IE7+, Firefox 4+, Safari 4+, Opera, Chrome, iOS Safari 4.0+, Android Browser 3+ The JavaScript code should be well structured and well commented. The example below uses jQuery. The contact form should send the form data as an email, and should utilize a CAPTCHA for spam prevention: EXAMPLES: The PSD visual design is similar to: /. But Elephant Web is not a responsive theme. The overall behavior is similar this Zig Zag theme: /zigzaghtml/ but this does not validate for HTML5. We have purchased a copy of this code which we can provide if required. The final produced page should work as well as Zig Zag in all aspects. Features of the responsive Zig Zag theme that we like: Top Navigation: On the first screen there is a top navigation bar. Once the page scrolls down below the navigation bar another navigation bar drops down and remains at the top of the page until you return to top of the home screen. When using the top navigation the page scrolls to an anchor point on the chosen screen. Slider on Home Page: The Zig Zag slider transitions nicely and automatically. We like the controls on the side and the lower right corner to allow selecting individual slides. Like the rest of the page it is fully responsive The PSD files show the first slide with a video screen. When clicked the video appears in a screen above the page. This should be HTML5 with the Flash fallback for browsers that do not support HTML5 video. We will use the following video: /Z9rtNUbbJ9s Note that the first screen slider will have four images that when clicked will go to the different screens. See also /plugins/royal-slider/responsive-demo.html for an example of a responsive slider. Expandable Footer: The footer of the Zig Zag theme expands upward over the page when "View more stuff" is clicked. The PSD shows this as a link to "About: Bridgz, Bann and Legal". Additional requirements: Buttons rendered in CSS, instead of images The contact information should use Microdata tags Font replacement using Google fonts. See the PSD and the Elephant Web for guidance. Note that the most of the images are for position only and will be replaced by us. PSD FILES: Server: Username: onumciva Password: Muw.3liy ------------------------------------------ Added 12 JUN 2012, 11:22 AM EDT Note that the "Engaging" screen as seen on the PSD requires an image gallary simular the AD Gallery, gallery plugin for jQuery. This is sometimes called a thumbnail slider. The "Measurable" screen includes a simple slide show with no interactivity. The "Contact" form should be simular to that found on Zig Zag including the contact-form-validate.js Desired Skills: jQuery HTML5 css3 Keywords: Web Programming, css3, jQuery, HTML5
| Expired |
Evelyn Guy
Blog & Content Writer
View profile
Colette Davis
SEO & SEM Consultant
View profile
More jquery html5 css3 projects
View AllRelated projects
Search for freelance jobscan’t wait for more clients
and advertising. Thank you."