2

is it possible to execute a Java Script function once the Yt video has been started with a click?

My code looks like this:

<html>
<head><title>onclick event demo</title>
</head>
<body>
    <h3>onclick event demo</h3>
    <p>Fires when the element is clicked.</p>
    
        <embed
        onclick="VideoStart()"
        src="https://www.youtube.com/embed/qK9v-VFfdY0?start=478" style="border:1px solid;" 
        >
        
        
</body>
</html>


<script>
function VideoStart(){
    ***code executed when clicking on the Yt-Video***
}

</script>

But for some reason nothing happens when I start or stop the YT video with a mouse click. Could someone please help me with this. I would appreciate an answer.

1 Answer 1

2
<html>
  <body>
    <!-- 1. The <iframe> (and video player) will replace this <div> tag. -->
    <div id="player"></div>

    <script>
      // 2. This code loads the IFrame Player API code asynchronously.
      var tag = document.createElement('script');

      tag.src = "https://www.youtube.com/iframe_api";
      var firstScriptTag = document.getElementsByTagName('script')[0];
      firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

      // 3. This function creates an <iframe> (and YouTube player)
      //    after the API code downloads.
      var player;
      function onYouTubeIframeAPIReady() {
        player = new YT.Player('player', {
          height: '360',
          width: '640',
          videoId: 'M7lc1UVf-VE',
          events: {
            'onReady': onPlayerReady,
            'onStateChange': onPlayerStateChange
          }
        });
      }

      // 4. The API will call this function when the video player is ready.
      function onPlayerReady(event) {
        //event.target.playVideo();
      }

      // 5. The API calls this function when the player's state changes.
      //    The function indicates that when playing a video (state=1),
      //    the player should play for six seconds and then stop.
      function onPlayerStateChange(event) {
        if (event.data == YT.PlayerState.PLAYING) {
          myFunction();
        }
      }
      function stopVideo() {
        player.stopVideo();
      }
      function myFunction(){
        alert("Hello world");
      }
    </script>
  </body

This should work. Just change the values for the one's you need. The myFunction will be called when the video starts playing.

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.