mp4_mouseenter

last update: 2020/12/19

<!doctype html>
<title>title</title>

<style>
video {
  width: 480px;
}
</style>

<video loop poster="thumb01.png">
<source src="sample01.mp4">
</video>

<video loop poster="thumb02.png">
<source src="sample02.mp4">
</video>

<script>
((d) => {
  const videos = d.getElementsByTagName('video');
  const playVideo = function () {
    this.play();
  };
  const pauseVideo = function () {
    this.pause();
  };
  [].forEach.call(videos, (item) => {
    item.addEventListener('mouseenter', playVideo, false);
    item.addEventListener('mouseleave', pauseVideo, false);
  });
})(document);
</script>

code_popup

sample (H.264 non-audio mp4)
valid by modern pc browser

sample (Animation GIF)
valid by modern pc browser