Media Player on Webpage

Source: Internet
Author: User

This article is purely fun to write. Basically, I don't want to help you, but it may be fun if you look at it. at least you can lie to mm. However, mm is very powerful now. Maybe you cannot lie to mm either. So when I mix up articles, I will entertain myself.

 

 

I often see some players written using scripts on the Internet. These players seem very good. I hope my magazines are not so boring, so I am determined to write a simple one by myself, because it is too complex, the client resources will become very tight. so how to do it? In fact, the idea is very simple. I know that there are many ways to include players in HTML, such as using ActiveX controls. However, in this way, the client will bear unnecessary expenses. therefore, I use the HTML Tag. although this mark is generally used for image placement. however, it can also be used to play multimedia in some standard formats. such as Avi, WAV, mid, and MP3. there is a property DYNSRC in this tag, which is specifically used for this job. (This is also documented in msdn ). the task of this attribute is to record the source of the media file. as follows:

Loop is used to control the number of loops. About blank indicates that there is nothing at the moment. Isn't it easy? Maybe now you also want to control it to play media files. yes, the key is to control the DYNSRC attribute. obviously, script is required. currently, most client browsers support client scripts. the procedure is as follows:

<SCRIPT>

Function play (Song)

{

If (document. Mid. DYNSRC = "about: blank ")

{

Document. Mid. DYNSRC = song

Bname. value = "stop"

}

Else

{

Document. Mid. DYNSRC = "about: blank"

Bname. value = "play"

}

}

</SCRIPT>

It is very simple. You can use a conditional logic to determine whether to play the video. The Transmitted parameter song is used to determine the Playing Track ..

Because the script language does not emphasize the type, it is dynamically bound during the runtime, and it does not have the compilation link. Therefore, you do not need to declare the running labels in. html as follows:

 

 

<Input type = "button" id = "bname"

 

Onclick = play (midselect. Options [midselect. selectedindex]. Value) value = play style = "color: # ffffcc; border-style: outset; border-width: 0"/>

 

<Select size = "1" name = "midselect"

 

Onchange = play (midselect. Options [midselect. selectedindex]. Value)>

<Option> select a song </option>

<Option value = "http://music.21youth.com/mp3/en/secret/1/adagio.mp3"> Adagio </option>

<Option value = "http://music.21youth.com/mp3/en/secret/3/dreamcatcher.mp3"> dreamcatcher </option>

<Option value = "http://music.21youth.com/mp3/en/secret/2/appassionata.mp3"> appassionata </option>

<Option value = "http://music.21youth.com/mp3/en/secret/3/aquarell.mp3"> aquarell </option>

<Option value = "http://music.21youth.com/mp3/en/secret/1/songfrom.mp3"> songs from a secret garden </option>

<Option value = "http://music.21youth.com/mp3/en/secret/4/greenwaves.MP3"> greenwaves </option>

<Option value = "http://music.21youth.com/mp3/en/secret/3/inourtears.mp3"> inourtears </option>

<Option value = "http://music.21youth.com/mp3/en/secret/1/serenadetospring.mp3"> serenadetospring </option>

<Option value = "http://music.21youth.com/mp3/en/secret/1/nocturne.mp3"> Nocturne </option>

<Option value = "http://music.21youth.com/mp3/en/secret/4/elegie.MP3"> elegie </option>

</SELECT> </P>

 

Well, a very simple player is ready. Complicated. You can add some artists and special effects, and then add some auxiliary functions)

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.