Grow your CSS skills. Land your dream job.

background slideshow ?

  • # February 22, 2013 at 4:40 pm

    hello , i was searching the web for about 6 hours to find any simple way to create a background slideshow like this website http://yokedesign.com.au

    but I didn’t find any thing , most of the ways was wrong and didn’t work for me

    so can anyone teach me how to create the same effect ?

    # February 22, 2013 at 4:57 pm

    Have you tried this one? http://tympanus.net/Tutorials/CSS3FullscreenSlideshow/index.html

    # February 22, 2013 at 5:12 pm

    They seem to be using [supersized](http://www.buildinternet.com/project/supersized/), I don’t know it but if you want the same, use the same?

    # February 23, 2013 at 1:17 am

    To make that happen you need to remove the srolling of the page and set the height and width of the slidshow according to the browser’s height
    I wrote the script of the slideshow for you http://codepen.io/sayed2x2/pen/qhjEf
    and I have given the height and the width of the slideshow in css and its not according the browser’s size. So you would need to remove that and take the height from javascript like this.

    var h=window.innerHeight;
    var w= window.innerWidth;
    document.getElementById(‘slider’).style.height=h;
    document.getElementById(‘slider’).style.width=w;

    # February 23, 2013 at 5:08 am

    Good effects.

    # February 23, 2013 at 5:25 am

    I used the [jquery plugin cycle](http://http://jquery.malsup.com/cycle/ “”) on [this site](http://www.articulate.uk.com “”) which was easy to implement.

    # February 26, 2013 at 6:17 pm

    Hi 7imaginary,

    I’m Yoke’s lead developer and oversaw the development of our current website. As CrocoDillon mentioned, we use Supersized to achieve the fullscreen background images. They’ve got a reference demo set up here than what we’ve got on our website.

    I’ve cleaned up the code on our website for a Pastebin example, which hopefully explains our setup in better detail.

    Remember when implementing it to load jQuery and the Supersized JS library and CSS code before you’re giving it code like provided in the Pastebin example.

    # February 26, 2013 at 6:31 pm

    @Andrew_at_Yoke, you guys must have awesome support if you just created an account here and on pastebin just to help out! :)

    Anonymous
    # May 6, 2013 at 11:07 pm

    Hi, friend. You can use Kvisoft Flash Slideshow Maker to create background slideshow with music or videos.

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

You must be logged in to reply to this topic.

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