treehouse : what would you like to learn today?
Web Design Web Development iOS Development

[Solved] Simple Script Needed for Swapping Background Images

  • Hi guys,

    I'm building my first site and am new to HTML and CSS. You can see my original thread here: http://css-tricks.com/forums/discussion/20733/input-requested-with-my-first-site#Item_24

    As part of my design, I was hoping to have a series of hair model images sequentially displayed on the background of the homepage. I don't need anything fancy, no user controls or navigation arrows or the like... Just the images being displayed on top of background color, on a loop.

    This has proven to be more difficult than I first imagined! Paulie_D was kind enough to point me to a site with some code snippets, but turned out to be a little too complex for me to make it work. I've searched this site and the Internet but was unable to find anything suitable for various reasons. I am planning on learning JavaScript in the near future, but I'm not there yet.

    I was wondering if anybody would know of a simple script that could achieve this effect. It would be greatly appreciated!

    Here's my code so far. The logo is a generic image I found on the Internet with approximately the same dimensions as the one I made.

    http://codepen.io/joe/pen/CInBJ

    Thank you!

  • @mr_z : This should solve your problem of looping through images. Image looping : http://trendmedia.com/news/infinite-rotating-images-using-jquery-javascript/

    I would have wrote something up for ya but this could easily be configurable and not re-inventing the wheel. You could do this with just css3 but jquery would work on all browser.

  • Hey John, just wanted to let you know, that script was exactly what I was looking for! Thanks a lot man! I copied the script and edited and positioned it using CSS. It worked perfectly for me. Take care