Manual Slideshow

<!DOCTYPE html>
<html>
<head>
	<title>Manual Slideshow | par NGLESSON</title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<meta name="keyword" content="Manual Slideshow">
	<meta name="author" content="Mezgani said">
	<meta name="copyright" content="NGLESSON">
	<meta name="robots" content="index,follow">
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" type="text/css">
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" type="text/css">  
	<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
	<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body class="container">
<div class="row">
	<div class="col-lg-6 mt-5">
		<h2 class="text-center">Manual Slideshow</h2>
		<div class="col-lg-12">
			<img class="Slideshow" src="../../assets/imgs/menu/citation-motivation.jpg" >
			<img class="Slideshow" src="../../assets/imgs/menu/problematique.jpg" >
			<img class="Slideshow" src="../../assets/imgs/menu/e-learning-developpement.jpg" >
			<button class="w3-button w3-black w3-display-left" onclick="plusDivs(-1)">&#10094;</button>
			<button class="w3-button w3-black w3-display-right" onclick="plusDivs(1)">&#10095;</button>
		</div>
	</div>		
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script type="text/javascript" src="script.js"></script>
</body>
</html>
.Slideshow{
    width: 100%;
    height: 400px;
}

var slideIndex = 1;
showDivs(slideIndex);

function plusDivs(n) {
  showDivs(slideIndex += n);
}

function showDivs(n) {
  var i;
  var x = document.getElementsByClassName("Slideshow");
  if (n > x.length) {slideIndex = 1}    
  if (n < 1) {slideIndex = x.length}
  for (i = 0; i < x.length; i++) {
     x[i].style.display = "none";  
  }
  x[slideIndex-1].style.display = "block";  
}
3D Gallery with CSS3 and jQuery

3D Gallery with CSS3 and jQuery

Ajouter supprimer dynamiquement des lignes sur un tableau

Ajouter supprimer dynamiquement des lignes sur un tableau

Buttons Styles Inspirations

Buttons Styles Inspirations

Cards box with title

Cards box with title

Image hover Flip Flap Style

Image hover Flip Flap Style

Page 404 exemple 01

Page 404 exemple 01

Pie Charts

Pie Charts

SwiperJS Lazy Load Images

SwiperJS Lazy Load Images

Titre section avec une bande style01

Titre section avec une bande style01

Transitions Animations SVG Style01

Transitions Animations SVG Style01

toggle switch style02

toggle switch style02

up down tr in table with js

up down tr in table with js