Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll

Using jQuery Plugins

Well done!

You have completed Using jQuery Plugins!

Sign up for Treehouse Back to Library

Add a Carousel to a Page

5:17 with Dave McFarland

Learn how to use the Slick plugin to add an interactive slideshow to our project's home page.

<div class="slides">
  <div>Slide 1</div>
  <div>Slide 2</div>
  <div>Slide 3</div>
</div>

Calling the Plugin

<script>
  $('.slides').slick();
</script>

Resources

Related Discussions

Have questions about this video? Start a discussion with the community and Treehouse staff.

Sign up

    Related Discussions

    Have questions about this video? Start a discussion with the community and Treehouse staff.

    Sign up

    then you select a page element and call the plugin. 0:00
    In the case of slick, the most challenging part is simply adding the HTML that 0:02
    makes up the carousel and even that isn't very difficult. 0:07
    Let me show you how. 0:10
    Let's add the carousel plugin to the home page. 0:12
    The most time consuming part of this is adding the HTML for the plugin. 0:15
    Now remember, the basic pattern. 0:19
    First, we add CSS and JavaScript files. 0:21
    Secondly, we structure HTML for the plugin. 0:24
    Third, we call the plugin. 0:26
    If you'd like to follow along, launch the workspace on this page or download 0:29

    You need to sign up for Treehouse in order to download course files.

    Sign up

      You need to sign up for Treehouse in order to set up Workspace

      Sign up