播放/暂停=背景fadetoggle.视频的结尾=背景Fadein

Question

我从Internet上取了一些代码。http://www.creativebloq.com/html5/build-custom-html5-video-player-9134473所有代码都是可下载的，或者您可以在此页面上看到它。

在JavaScript文件中，他们将视频结构放在函数中。播放器的所有按钮均在DIV类中列出，并在JavaScript文件中的函数中跨度。不是HTML。

所以我尝试在javaScript文件中转到"按钮"类的play/暂停按钮上执行fadetoggle。我在html中写了《淡淡的淡淡的功能》。它不会从Javafile拿起按钮类或任何其他元素。该函数仅从HTML文件拾取元素。

功能有效。如果使用HTML的使用类容器包含所有视频，则可以使用。但是我只需要播放按钮。

本质上，可以在html中不在java文件中列出的类，例如：''fadetoggle函数中使用？

Answer 1

这是从他们的网站（http://www.inserthtml.com/2013/03/custom-html5-video-player/）。我取消了代码的网站。所有这些课程在Java中。但是我找到了可以帮助我链接播放/暂停按钮的课程。它仍然在Java文件中，其他地方，而不是在视频的结构中。我仍然不知道为什么我无法将功能链接到结构视频中的功能。

       // Wrap the video in a div with the class of your choosing
            $this.wrap('<div class="'+$settings.videoClass+'"></div>');

            // Select the div we just wrapped our video in for easy selection.
            var $that = $this.parent('.'+$settings.videoClass);
// The Structure of our video player
             {
  $( '<div class="player">'
 + '<div class="play-pause play">'
   + '<span class="play-button">&#9658;</span>'
   + '<div class="pause-button">'
     + '<span> </span>'
         + '<span> </span>'
   + '</div>'
 + '</div>'
 + '<div class="progress">'
   + '<div class="progress-bar">'
     + '<div class="button-holder">'
       + '<div class="progress-button"> </div>'
     + '</div>'
   + '</div>'
   + '<div class="time">'
     + '<span class="ctime">00:00</span>'
     + '<span class="stime"> / </span>'
     + '<span class="ttime">00:00</span>'
   + '</div>'
 + '</div>'
 + '<div class="volume">'
   + '<div class="volume-holder">'
     + '<div class="volume-bar-holder">'
       + '<div class="volume-bar">'
         + '<div class="volume-button-holder">'  
           + '<div class="volume-button"> </div>'
         + '</div>'
       + '</div>'
     + '</div>'
   + '</div>'
   + '<div class="volume-icon v-change-0">'
     + '<span> </span>'
   + '</div>'
 + '</div>'
 + '<div class="fullscreen"> '
   + '<a href="#"> </a>'
 + '</div>'

''）.appendto（$ that）;

}