a bit more depth. Pick up FlexSlider Now we need to download the FlexSlider. So head over to flex.madebymufffin.com and grab the latest version, which at the time of writing is version 1.8. Once downloaded, locate the zipped file, unzip it and open up the folder. You will see two JS files and a CSS file. You need to put them into their respective folders within your own directory, then link them up inside the head of the index.html file. FlexSlider markup Adding in the markup for FlexSlider is really very simple. First, start with a containing div (&lt;div id="slider"&gt;) that we can use to position the whole slider if we need to. Then we just need to add a single containing element: div class="flexslider"; this is what we are going to use as our main hook for the JS code. 001 &lt;div id="slider"&gt; 002    &lt;div&gt; 003 004 005    &lt;/div&gt; 006 &lt;/div&gt; Slides list The next step is to add an unordered list (&lt;ul&gt;) in which to place the images we are going to populate the slider with. Give the list a class name of 'slides' and add in three list items, just for now; this can be expanded on later. If you go back and take a look within the styles.css file, you will remember that we used a reset to get rid of the default bullet points of the &lt;li&gt; item. Adding the images Incorporating our images is very straightforward and nothing new to us. The pictures we