Vidéo background en html5 style01

<!DOCTYPE html>
<html>
<head>
  <title>Background vidéo HTML5 | 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="Background vidéo HTML5">
  <meta name="author" content="Mezgani said">
  <meta name="copyright" content="NGLESSON">
  <link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
<video autoplay muted loop id="videoOne">
  <source src="../../assets/video/Home-Slider-2-mini.mp4" type="video/mp4">
  Your browser does not support HTML5 video.
</video>
<div class="content">
  <h1>Title title</h1>
  <p>
    Lorem ipsum dolor sit amet, an his etiam torquatos. Tollit soleat phaedrum te duo, eum cu recteque expetendis neglegentur. 
    Cu mentitum maiestatis persequeris pro, pri ponderum tractatos ei. Id qui nemore latine molestiae, ad mutat oblique delicatissimi pro.
  </p>
  <button id="btnAction" onclick="getVideo()">Pause</button>
</div>
<script type="text/javascript" src="script.js"></script>
</body>
</html>
* {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: Arial;
  font-size: 17px;
}

#videoOne {
  position: fixed;
  right: 0;
  bottom: 0;
  min-width: 100%; 
  min-height: 100%;
}

.content {
  position: fixed;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  color: #f1f1f1;
  width: 100%;
  padding: 20px;
}

#btnAction {
  width: 200px;
  font-size: 18px;
  padding: 10px;
  border: none;
  background: #000;
  color: #fff;
  cursor: pointer;
}

#btnAction:hover {
  background: #ddd;
  color: black;
}
var video = document.getElementById("videoOne");
var btn = document.getElementById("btnAction");

function getVideo() {
  if (video.paused) {
    video.play();
    btn.innerHTML = "Pause";
  } else {
    video.pause();
    btn.innerHTML = "Play";
  }
}
Bootstrap 3 Popover avec html contenu

Bootstrap 3 Popover avec html contenu

Créer un effet de défilement vers le bas de la souris animé

Créer un effet de défilement vers le bas de la souris animé

Dropdown right aligned B4

Dropdown right aligned B4

Form login b4 01

Form login b4 01

Image hover 01

Image hover 01

Input range slider HTML style01

Input range slider HTML style01

Loading Style snake

Loading Style snake

Loading style water animation

Loading style water animation

Pagination with Jquery

Pagination with Jquery

Radio Input Image Checkbox 01

Radio Input Image Checkbox 01

Table responsive avec css native

Table responsive avec css native

Up Down Animation With CSS Style01

Up Down Animation With CSS Style01