2 Replies Latest reply on Nov 26, 2017 8:05 AM by wtsund

    Video Play On Mouse Over

    wtsund Level 1

      I am creating a website that I need a collum of videos that I want to play when someone hovers their mouse over and will pause when the mouse cursor is not on it then start from where it left off. The video will also loop and has no sound.

      I have looked around and there is some HTML5 code that I have found but does not work except with the demo youtube video included. I have added my files to upload (1112.mp4 & 1114.mp4) and they are in my assets so it is not missing the video.

       

      Question 1 is there a way to do it without coding

       

      Question 2 if there is not then what code will work?

       

      Note: I have very limited knowledge when it comes to coding (Thus why I am using muse)

       

      Thank You For Your Help

       

      Code That I Have and Is Leaving A Blank Space:

         <html>

      <head>

      </head>

      <body>

      <div style="text-align:center" onmouseover="Play()" onmouseout="Pause()">

        <video id="f150" width="480">

          <source src="1112.mp4" type="video/mp4" />

          Your browser does not support HTML5 video.

        </video>

      </div>

       

       

      <script type="text/javascript">

      var myVideo=document.getElementById("video1");

       

       

      function Pause()

      {

        myVideo.pause();

      }

      function Play()

      {

      if (myVideo.paused)

        myVideo.play();    

      }   

         

      </script>

      </body>

      </html>

       

       

      Code That has a Video that worked until I added a second HTML object:

         <html>

      <head>

      </head>

      <body>

      <div style="text-align:center" onmouseover="Play()" onmouseout="Pause()">

        <video id="other" width="480">

          <source src="http://clips.vorwaerts-gmbh.de/VfE_html5.mp4" type="video/mp4" />

          <source src="http://clips.vorwaerts-gmbh.de/VfE_html5.ogg" type="video/ogg" />

          Your browser does not support HTML5 video.

        </video>

      </div>

       

       

      <script type="text/javascript">

      var myVideo=document.getElementById("video1");

       

       

      function Pause()

      {

        myVideo.pause();

      }

      function Play()

      {

      if (myVideo.paused)

        myVideo.play();    

      }   

         

      </script>

      </body>

      </html>