Week 5: Carousel Images

This week I’ve been working on updating a few issues on my site in response to feedback I’ve gotten. I’ve been able to implement most of the features I wanted, but there are still some elements (like responsive design) that I haven’t had the time to properly look into yet.

The major achievement for me this week was creating a carousel of images on my homepage – basically having a hero image which changes every few sections, scrolling through my portfolio works. I used a guide over at w3schools.com which was by far the easiest to implement out of all the different methods I looked into. I’m hoping to potentially be able to include links with these images to their respective portfolio page, but that will probably take some time to wrangle.

index_wk5_state2

index_wk5_state1

index_wk5_html

index_wk5_css

As you can see, the first image is the initial state will cycle through each of the portfolio project images, as seen in the second state in the image below. This cycles every three seconds, so visitors can see at a glance some of my work in a short amount of time.

I’ve also been working on this week’s SBEs; here’s a screengrab and the code below:

table_navmenu_wk5

table_html

table_css

It’s a little hard to see, but the nav menu with the white background is being hovered over, using a: hover to change its state.

I’ve been working primarily on creating a back button on the individual project pages, which you can see below:

honestea_wk5

honestea_html

honestea_css

This helps it act in a much more user friendly manner, and doesn’t leave users ‘stranded’ so to speak, when they access each individual page.

The site is:

C2 By Design

Feel free to take a look, and I’d love to hear any feedback about it!

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s