Free Trial

Safari Books Online is a digital library providing on-demand subscription access to thousands of learning resources.


  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • DownloadDownload
  • PrintPrint
Share this Page URL
Help

10. Featuring Content in Carousels and S... > Time for action — adding the slidesh...

Time for action — adding the slideshow

The jCarousel plugin has taken care of setting up the carousel for us, but we want to get fancy and also add a slideshow area.

  1. We're on our own here, so we'll create a separate function for creating the slideshow area. Then we'll call the new function inside our document ready statement:
    function slideshowInit() {
    // Slideshow setup goes here
    }
    $(document).ready(function(){
    slideshowInit();
    $('#thumb-carousel').jcarousel({
    scroll: 6,
    wrap: 'circular'
    });
    });
    
  2. First up, we'll wrap a container around our thumbnail list to create the slideshow area. We find ourselves already in need of referring to the thumbnail list again, so let's store a reference to it in a variable and update the call to the jcarousel() method as follows:
    var thumbs = $('#thumb-carousel');
    function slideshowInit() {
    // Slideshow setup goes here
    }
    $(document).ready(function(){
    slideshowInit();
    thumbs.jcarousel({
    scroll: 6,
    wrap: 'circular'
    });
    });
    

  

You are currently reading a PREVIEW of this book.

                                                                                        

Get instant access to over
$1 million worth of books and videos.

  

Start a Free Trial