Download Jqurey Slider
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Slider HTML5 Template </title>
<link rel="icon" type="image/png" sizes="16x16" href="assets/assets/images/slider/favicon-16x16.png">
<link rel="stylesheet" href="assets/css/bootstrap.min.css">
<link rel="stylesheet" href="assets/css/owl.carousel.min.css">
<link rel="stylesheet" href="assets/css/owl.theme.default.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.2/css/all.css">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link rel="stylesheet" href="assets/css/aos.css">
<link rel="stylesheet" href="assets/css/progress.css">
<link rel="stylesheet" href="assets/css/video.popup.css">
<link rel="stylesheet" href="assets/css/style.css">
</head>
<!-- Navigation -->
<div class="wraper">
<div class="navigation">
<div class="navigation-left">
<a href="#">Shoes</a>
<a href="#">Clothes</a>
<a href="#">Accessories</a>
</div>
<div class="navigation-center">
<img src="images/logo.png" alt="" />
</div>
<div class="navigation-right">
<a href="#"><img src="images/shopping-bag.png" alt="" /></a>
<button class="login-btn" href="#">Login</button>
</div>
</div>
<!-- Slider Wrapper -->
<div class="css-slider-wrapper">
<input
type="radio"
name="slider"
class="slide-radio1"
checked
id="slider_1"
/>
<input type="radio" name="slider" class="slide-radio2" id="slider_2" />
<input type="radio" name="slider" class="slide-radio3" id="slider_3" />
<input type="radio" name="slider" class="slide-radio4" id="slider_4" />
<!-- Slider Pagination -->
<div class="slider-pagination">
<label for="slider_1" class="page1"></label>
<label for="slider_2" class="page2"></label>
<label for="slider_3" class="page3"></label>
<label for="slider_4" class="page4"></label>
</div>
<!-- Slider #1 -->
<div class="slider slide-1">
<img src="images/model-1.png" alt="" />
<div class="slider-content">
<h4>New Product</h4>
<h2>Denim Longline T-Shirt Dress With Split</h2>
<button type="button" class="buy-now-btn" name="button">$130</button>
</div>
<div class="number-pagination">
<span>1</span>
</div>
</div>
<!-- Slider #2 -->
<div class="slider slide-2">
<img src="images/model-2.png" alt="" />
<div class="slider-content">
<h4>New Product</h4>
<h2>Denim Longline T-Shirt Dress With Split</h2>
<button type="button" class="buy-now-btn" name="button">$130</button>
</div>
<div class="number-pagination">
<span>2</span>
</div>
</div>
<!-- Slider #3 -->
<div class="slider slide-3">
<img src="images/model-3.png" alt="" />
<div class="slider-content">
<h4>New Product</h4>
<h2>Denim Longline T-Shirt Dress With Split</h2>
<button type="button" class="buy-now-btn" name="button">$130</button>
</div>
<div class="number-pagination">
<span>3</span>
</div>
</div>
<!-- Slider #4 -->
<div class="slider slide-4">
<img src="images/model-4.png" alt="" />
<div class="slider-content">
<h4>New Product</h4>
<h2>Denim Longline T-Shirt Dress With Split</h2>
<button type="button" class="buy-now-btn" name="button">$130</button>
</div>
<div class="number-pagination">
<span>4</span>
</div>
</div>
</div>
</div>
<body>
</body>
<script src="assets/js/jquery-3.5.1.min.js"></script>
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="assets/js/lightbox-plus-jquery.min.js"></script>
<script src="assets/js/aos.js"></script>
<script src="assets/js/popper.min.js"></script>
<script src="assets/js/bootstrap.min.js"></script>
<script src="assets/js/owl.carousel"></script>
<script src="assets/js/owl.carousel.min.js"></script>
<script src="assets/js/circle-progress.js"></script>
<script src="assets/js/video.popup.js"></script>
<script src="assets/js/Slider-app.js"></script>
<script src="assets/js/script.js"></script>
</body>
</html>
0 Comments