Responsive Parallax Website

This website is part of the Boys & Girls Clubs Million Members, Million Hours of Service campaign, sponsored by Citi Foundation. The goal of the campaign is to motivate Boys & Girls Clubs across the US to inspire youth to participate in service activities throughout the year. Within five years, they hope to have one million members contributing one million hours of service. The goal is for every Club member to engage in at least one hour of community service or service learning annually.

Technical Details:

I hand-coded this responsive, parallax website in HTML5, CSS3 and jQuery. I coded this site to be viewed on desktops, mobile tablets/iPads and mobile phones through the use of media queries and flexible images.

Main Structure:
- The site consists of three slides with a responsive footer band after slides one and three. Each slide consists of a left and right column (div tags with floats) with right columns sliding under left columns when viewed on mobile tablets.

jQuery Controls Used:
- I incorporated an All-in-One Carousel Slider, used to rotate through photos on slide one.

Fonts Used:
- I downloaded and installed Perspective Sans font from FontSquirell.com on our webserver. This is the font used for raw text.

CSS

Click here to view the CSS Style Sheet for this site.

HTML

Click here to view the HTML for this site..

 

Comments are closed.