Creating an Image Slider part 1

Image Slider



Now we can create a sample image slider project. The images will be changed using "Next" and "Prev" buttons.
Now, let’s create our HTML, which includes an image and the two navigation buttons:
<div>
<button> Prev </button>
<img id="slider" src="http://www.sololearn.com/uploads/slider/1.jpg"
width="200px" height="100px"/>
<button> Next </button>
</div>
Try It Yourself

Next, let's define our sample images in an array:var images = [
"http://www.sololearn.com/uploads/slider/1.jpg",
"http://www.sololearn.com/uploads/slider/2.jpg",
"http://www.sololearn.com/uploads/slider/3.jpg"
];

We are going to use three sample images that we have uploaded to our server. You can use any number of images

Comments