Silverlight是嵌入在網(wǎng)頁(yè)當(dāng)中的，如html，aspx等頁(yè)面中，首先在網(wǎng)頁(yè)中放一個(gè)“容器”，如div或panel等。記在要使用Silverlight的頁(yè)面中引用Silverlight.js。本例創(chuàng)建一個(gè)靜態(tài)頁(yè)面lss.htm,頁(yè)面代碼如下：
**************************************************************
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>silverlight 播放音頻和視頻</title>
<script type="text/javascript" src="Silverlight.js"></script>
<script type="text/javascript" src="lss.htm.js"></script>
<script type="text/javascript" src="lss.xaml.js"></script>
</head>
<body>
silverlight 播放音頻和視頻
<br /><br />
<input id="Button1" type="button" onclick="PlayAudio()" value="播放" />
<input id="Button2" type="button" onclick="PauseAudio()" value="暫停" />
<input id="Button3" type="button" onclick="StopAudio()" value="停止" />
<input id="Button4" type="button" onclick="LargerVolume()" value="音量大" />
<input id="Button5" type="button" onclick="SmallerVolume()" value="音量小" />
<input id="Button6" type="button" onclick="LeftVolume()" value="左平衡" />
<input id="Button7" type="button" onclick="RightVolume()" value="右平衡" />
<input id="Button8" type="button" onclick="MiddleVolume()" value="中間" />
<div id="SilverlightControlHost">
<script type="text/javascript">
createSilverlight();
</script>
</div>
<br /><br />
</body>
</html>
**************************************************************
創(chuàng)建一個(gè)lss.htm.js頁(yè)面實(shí)現(xiàn)lss.htm中createSilverlight()方法，lss.htm.js代碼如下:
**************************************************************
function createSilverlight()
{
Silverlight.createObjectEx({
source:'lss.xaml',
parentElement: document.getElementById('SilverlightControlHost'),
id:'SilverlightControl',
properties:{
width:'500',
height:'400',
background:'lightblue',
isWindowless:'false',
version:'1.0'
},
events:
{},
context:null
});
}
if(!window.Silverlight)
{
window.Silverlight = {};
}
Silverlight.createDelegate = function(instance,method){
return function(){
return method.apply(instance,arguments);
}
}
**************************************************************
創(chuàng)建一個(gè)xaml文件顯示Silverlight內(nèi)容，本例創(chuàng)建的文件名為：lss.xaml ，代碼如下：
**************************************************************
<Canvas xmlns="http://schemas.microsoft.com/client/2007" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Canvas x:Name="SilverlightPlugIn">
<TextBlock Canvas.Left="10" Canvas.Top="20" Opacity="0.5" Foreground="red" Text="正在播放音頻 文件....."></TextBlock>
<MediaElement x:Name="audio" Source="audio/加州旅館WMV-老鷹樂(lè)隊(duì).wmv" Volume="0.5" AutoPlay="false"></MediaElement>
</Canvas>
</Canvas>
TextBlock節(jié)是用來(lái)顯示文本的，MediaElement 節(jié)是用來(lái)放置音頻和視頻文件的。
**************************************************************
創(chuàng)建實(shí)現(xiàn)xaml文件里面功能的文件lss.xaml.js,代碼如下：
// 播放
function PlayAudio()
{
var SilverlightControl = document.getElementById("SilverlightControl");
var MediaElement = SilverlightControl.content.findName("audio")
MediaElement.play();
}
// 暫停
function PauseAudio()
{
var SilverlightControl = document.getElementById("SilverlightControl");
var MediaElement = SilverlightControl. content.findName("audio");
MediaElement.pause();
}
// 停止
function StopAudio()
{
var SilverlightControl = document.getElementById("SilverlightControl");
var MediaElement = SilverlightControl. content.findName("audio");
MediaElement.stop();
}
// 增大聲音
function LargerVolume()
{
var SilverlightControl = document.getElementById("SilverlightControl");
var MediaElement = SilverlightControl. content.findName("audio");
if(MediaElement.Volume<1)
{
MediaElement.Volume+=0.1;
}
}
// 減小聲音
function SmallerVolume()
{
var SilverlightControl = document.getElementById("SilverlightControl");
var MediaElement = SilverlightControl. content.findName("audio");
if(MediaElement.Volume>0)
{
MediaElement.Volume-=0.1;
}
}
// 左音道輸出
function LeftVolume()
{
var SilverlightControl = document.getElementById("SilverlightControl");
var MediaElement = SilverlightControl. content.findName("audio");
MediaElement.Balance = -1;
}
// 右音道輸出
function RightVolume()
{
var SilverlightControl = document.getElementById("SilverlightControl");
var MediaElement = SilverlightControl. content.findName("audio");
MediaElement.Balance = 1;
}
// 左右音道輸出
function MiddleVolume()
{
var SilverlightControl = document.getElementById("SilverlightControl");
var MediaElement = SilverlightControl. content.findName("audio");
MediaElement.Balance = 0;
}
記得要在lss.htm中引用lss.xaml.js，lss.htm.js，Silverlight.js文件。
浙公網(wǎng)安備 33010602011771號(hào)