SwiperJS Lazy Load Images

<!DOCTYPE html>
<html>
  <head>
    <title>SWIPERJS | 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="SWIPERJS">
    <meta name="author" content="Mezgani said">
    <meta name="copyright" content="NGLESSON">
    <link href="" rel="stylesheet" type="text/css">
	  <link rel="stylesheet" href="https://unpkg.com/swiper/swiper-bundle.min.css">    
    <link href="style.css"  rel="stylesheet" type="text/css">
</head>
<body>
  <!-- Swiper -->
  <div class="swiper-container">
    <div class="swiper-wrapper">
      <div class="swiper-slide">
        <!-- Required swiper-lazy class and image source specified in data-src attribute -->
        <img data-src="https://source.unsplash.com/random/" class="swiper-lazy">
        <!-- Preloader image -->
        <div class="swiper-lazy-preloader swiper-lazy-preloader-white"></div>
      </div>
      <div class="swiper-slide">
        <img data-src="https://source.unsplash.com/random/" class="swiper-lazy">
        <div class="swiper-lazy-preloader swiper-lazy-preloader-white"></div>
      </div>
      <div class="swiper-slide">
        <img data-src="https://source.unsplash.com/random/" class="swiper-lazy">
        <div class="swiper-lazy-preloader swiper-lazy-preloader-white"></div>
      </div>
      <div class="swiper-slide">
        <img data-src="https://source.unsplash.com/random/" class="swiper-lazy">
        <div class="swiper-lazy-preloader swiper-lazy-preloader-white"></div>
      </div>
      <div class="swiper-slide">
        <img data-src="https://source.unsplash.com/random/" class="swiper-lazy">
        <div class="swiper-lazy-preloader swiper-lazy-preloader-white"></div>
      </div>
      <div class="swiper-slide">
        <img data-src="https://source.unsplash.com/random/" class="swiper-lazy">
        <div class="swiper-lazy-preloader swiper-lazy-preloader-white"></div>
      </div>

    </div>
    <!-- Add Pagination -->
    <div class="swiper-pagination swiper-pagination-white"></div>
    <!-- Navigation -->
    <div class="swiper-button-next swiper-button-white"></div>
    <div class="swiper-button-prev swiper-button-white"></div>
  </div>
  <script src="https://unpkg.com/swiper/swiper-bundle.min.js"></script> 
  <script type="text/javascript" src="script.js"></script>
</body>
</html>
html,
body {
  position: relative;
  height: 100%;
}

body {
  background: #000;
  font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
  font-size: 14px;
  color: #000;
  margin: 0;
  padding: 0;
}

.swiper-container {
  width: 100%;
  height: 100%;
}

.swiper-slide {
  text-align: center;
  font-size: 18px;
  background: #000;

}

.swiper-slide img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  -ms-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  position: absolute;
  left: 50%;
  top: 50%;
}
var swiper = new Swiper('.swiper-container', {
    lazy: true,
    pagination: {
      el: '.swiper-pagination',
      clickable: true,
    },
    navigation: {
      nextEl: '.swiper-button-next',
      prevEl: '.swiper-button-prev',
    },
});
toggle switch style03

toggle switch style03

SwiperJS style02 avec 6 colonnes

SwiperJS style02 avec 6 colonnes

Input valid invalid HTML CSS

Input valid invalid HTML CSS

Input range slider HTML style01

Input range slider HTML style01

Input file style02

Input file style02

Form login et créer un compte style01

Form login et créer un compte style01

Form login 03

Form login 03

Dropdown right aligned B4

Dropdown right aligned B4

Créer des tds dynamiquement dans une table html

Créer des tds dynamiquement dans une table html

Cards box with title

Cards box with title

Card Bootstrap4 01

Card Bootstrap4 01

Bootstrap 3 Popover avec html contenu

Bootstrap 3 Popover avec html contenu