Jquery plug-in Jplayer Usage Analysis _ jquery

This article mainly introduces the usage of jquery plug-in Jplayer, which is of practical value. If you are interested, you can refer to the introduction to jplayer plug-in because it has the best compatibility and can be compatible with IE6, the official website provides a detailed description of its compatibility.

This is the primary reason I chose to use it.

Learn how to use it from the perspective of requirements. First requirement: MP3 audio is played on the webpage. The style is as follows:

When I first saw this requirement, I still felt a little difficult. From the official website (Http://www.jplayer.cn/), Download the compressed package, and take out the example (Path:/examples/blue. monday/demo-01-supplied-mp3.htm), which is also the fastest way to learn to use this plug-in. The examples in the compressed package are comprehensive and there is always one suitable for you.

The demo style is as follows:

Now let's take a look at its html structure:

 

    
    
      

          Play        Stop      
      

          
          
        
      
      

          Mute        Max volume        
          
        
      
      

          
 
        
 
        
          Repeat        
      
    
    

        
 
    
    

  Update Required To play the media you will need to either update your browser to a recent version or update your Flash plugin
  

Is the structure quite clear? All the functions we need are included in this section. Based on my needs, I can only retain the play and pause buttons and progress bars, and simplify the html:

 

    
    
      

          Play      
      

          
          
        
      
        
  

The next step is the style issue. We can reset its style to implement our original functions. I suggest adding a class to html and resetting it.

I will not elaborate on how to implement it. The most important thing is to call js.

Let's take a look at how the demo is called? What parameters are used? What does a parameter mean?