The biggest advantage of jQuery is in its ability to work with the DOM, and create neat effects and animations. In this task, we will learn how to create our own image/content slider with the ability to load images dynamically.
We will need to prepare some example images and save them to our images
folder. And,
of course, we will need the jQuery library.
As usual, we will start with HTML code:
<div class="slideBox"> <div id="slider1" class="mslider"> <ul> <li title="1.jpg"></li> <li title="2.jpg"></li> <li title="3.jpg"></li> <li title="5.jpg"></li> </ul> <div class="navContainer"> <div class="buttonsContainer"> <span class="btnPrev button">Prev</span> <span class="btnNext button">Next</span> </div> </div> </div> <...