Book Image

jQuery for Designers Beginner's Guide Second Edition

By : Natalie Maclees
Book Image

jQuery for Designers Beginner's Guide Second Edition

By: Natalie Maclees

Overview of this book

Table of Contents (21 chapters)
jQuery for Designers Beginner's Guide Second Edition
Credits
About the Author
Acknowledgments
About the Reviewers
www.PacktPub.com
Preface
Index

Time for action – creating a fullscreen slideshow


We'll keep working with the files that we created in the Time for action – creating a fullscreen background image section. The only change we'll need to make to create a slideshow rather than a single fullscreen background image is to our scripts.js file. To do so, perform the following steps:

  1. Open scripts.js and remove the src and fade options from the vegas() method, as shown in the following code:

    $(document).ready(function(){
      $.vegas({
      
      })('overlay', {
        src: 'overlays/03.png'
      });
    });
  2. Next, we need to tell Vegas that we want to use a slideshow. Before we pass in the options object, tell Vegas to use a slideshow, as shown in the code:

    $(document).ready(function(){
      $.vegas('slideshow', {
    
      })('overlay', {
        src: 'overlays/03.png'
      });
    });

    Note that this slideshow option is outside the curly braces.

  3. We'll pass in the slideshow options we want to use, inside the curly braces. First, let's add delay. This tells Vegas how long to...