jQuery Simplest Image Slider with Controls

Simple, easy to use and lightweight image slider with controls. The plugin is also work without jQuery, you can control image sliding with next and previous buttons.

Plugin Overview

Plugin: simpleSlider
Author: K33J
Licence: MIT Licence
Published: January 12, 2024
Repository: Fork on GitHub
Dependencies: jQuery 1.3.1 (Optional)

File Type: zip archive (HTML, CSS & JavaScript)
Package Size: 117 KB

How to Use Image Slider with Controls :

1. After downloading this project, include the simple slider‘s CSS and JavaScript file into Your HTML document.

<!-- Simple Slider CSS -->
<link rel="stylesheet" href="css/style.css">

<!-- Simple Slider Js -->
<script src="js/script.js" defer></script>

2. Now, create HTML structure like below for the slider and put your image’s links.

<div class="container">
			<img src="img/arrow_left.svg" alt="ArrowLeft" width="128" height="128" id="ArrowLeft">
			<div class="slider">
				<div id="img-list">
					<img src="https://source.unsplash.com/600x300/?fitness" alt="" width="128" height="128">
					<img src="https://source.unsplash.com/600x300/?yoga" alt="" width="128" height="128">
					<img src="https://source.unsplash.com/600x300/?bike" alt="" width="128" height="128">
					<img src="https://source.unsplash.com/600x300/?bikni" alt="" width="128" height="128">
					<img src="https://source.unsplash.com/600x300/?flower" alt="" width="128" height="128">
					<img src="https://source.unsplash.com/600x300/?cat" alt="" width="128" height="128">
					<img src="https://source.unsplash.com/600x300/?running" alt="" width="128" height="128">
			<img src="img/arrow_right.svg" alt="ArrowRight" width="128" height="128" id="ArrowRight">

Leave a Comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.

About CodeHim

Free Web Design Code & Scripts - CodeHim is one of the BEST developer websites that provide web designers and developers with a simple way to preview and download a variety of free code & scripts. All codes published on CodeHim are open source, distributed under OSD-compliant license which grants all the rights to use, study, change and share the software in modified and unmodified form. Before publishing, we test and review each code snippet to avoid errors, but we cannot warrant the full correctness of all content. All trademarks, trade names, logos, and icons are the property of their respective owners... find out more...

Please Rel0ad/PressF5 this page if you can't click the download/preview link