首页>>音乐/视频>>简单的视频播放器(2015-10-11)

简单的视频播放器

简单的视频播放器

 

XML/HTML Code
  1. <div class="jp-gui">  
  2.             <div class="jp-interface">  
  3.                 <div class="jp-controls-holder">  
  4.           
  5.                     <!--play and pause buttons-->  
  6.                     <a href="javascript:;" class="jp-play" tabindex="1">play</a>  
  7.                     <a href="javascript:;" class="jp-pause" tabindex="1">pause</a>  
  8.                     <span class="separator sep-1"></span>  
  9.                    
  10.                     <!--progress bar-->  
  11.                     <div class="jp-progress">  
  12.                         <div class="jp-seek-bar">  
  13.                             <div class="jp-play-bar"><span></span></div>  
  14.                         </div>  
  15.                     </div>  
  16.                    
  17.                     <!--time notifications-->  
  18.                     <div class="jp-current-time"></div>  
  19.                     <span class="time-sep">/</span>  
  20.                     <div class="jp-duration"></div>  
  21.                     <span class="separator sep-2"></span>  
  22.                    
  23.                     <!--mute / unmute toggle-->  
  24.                     <a href="javascript:;" class="jp-mute" tabindex="1" title="mute">mute</a>  
  25.                     <a href="javascript:;" class="jp-unmute" tabindex="1" title="unmute">unmute</a>  
  26.                    
  27.                     <!--volume bar-->  
  28.                     <div class="jp-volume-bar">  
  29.                         <div class="jp-volume-bar-value"><span class="handle"></span></div>  
  30.                     </div>  
  31.                     <span class="separator sep-2"></span>  
  32.                    
  33.                     <!--full screen toggle-->  
  34.                     <a href="javascript:;" class="jp-full-screen" tabindex="1" title="full screen">full screen</a>  
  35.                     <a href="javascript:;" class="jp-restore-screen" tabindex="1" title="restore screen">restore screen</a>  
  36.                   
  37.                 </div><!--end jp-controls-holder-->  
  38.             </div><!--end jp-interface-->  
  39.         </div><!--end jp-gui-->  

 


原文地址:http://www.freejs.net/article_yingyueshipin_509.html