Grow your CSS skills. Land your dream job.

Fullscreen Background Image Rotator

  • # August 3, 2012 at 2:07 am

    Hello,

    I’m trying to achieve a background image rotation very similar to this: http://www.rapturecamps.com/ . Something that’s fullscreen and has clickable buttons to change the image. I’ve been searching for tutorials all over the web, but haven’t really found anything that achieves this goal.

    I’ve tested and successfully implemented methods such as this: http://ma.tt/2003/05/a-better-image-rotator/ . However, I’m now looking to improve the presentation to something more smooth, like the example seen in rapturecamps.com. Any suggestions would be greatly appreciated!

    # August 3, 2012 at 2:31 am

    It’s relatively easy, use a slider, modify the css to fill the entire screen, and then wala, you have a full screen slider…. I wrote my own plugin like this, but I don’t share it, sorry about that.

    # August 3, 2012 at 12:19 pm

    Thanks for the reply. Do you have a recommendation on a slider that would be easy to use?

    # August 4, 2012 at 1:50 pm

    The following plugin isn’t exactly tailored to your needs, but something similar. I recommend you have a look.
    http://buildinternet.com/project/supersized/
    Also, as devsign noted, You could easily modify an existing responsive slider to stretch the width of the screen. You could try modifying flexslider.

    http://www.woothemes.com/flexslider/

    # August 4, 2012 at 5:11 pm

    That site is using supersized.

    # August 4, 2012 at 7:58 pm

    Supersized from my experience is the best one out there…powerful and simple at the same time…

    # August 5, 2012 at 6:25 pm

    Thank you for all the feedback everyone! I’ll give it a look.

Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".