您好,登錄后才能下訂單哦!
這期內容當中小編將會給大家帶來有關Silverlight中怎么嵌入HTML,文章內容豐富且以專業的角度為大家分析和敘述,閱讀完這篇文章希望大家可以有所收獲。
Object元素可以被用于Silverlight插件的HTML嵌入和配置,但是要在瀏覽器兼容的方式下進行。比較常見的應用有倆種,一個是嵌入Silverlight 插件,并將該應用程序指定給宿主。另一個是指定在未安裝Silverlight 時顯示的備用HTML。
這些應用對應于 HTML 頁的不同部分,尤其是,對應于object 元素的不同配置參數。首先我們來介紹怎樣使用每個過程中的代碼段。***把他們結合起來,就確保得到了跨瀏覽器兼容性,并基于 Visual Studio 和 Expression Blend 用來動態生成測試頁的模板。
嵌入插件
將object 元素添加到HTML,并指定屬性和子param 元素。
<object width="300" height="300" data="data:application/x-silverlight-2," type="application/x-silverlight-2" > <param name="source" value="SilverlightApplication1.xap"/> </object>
width 和 eight 屬性是跨瀏覽器兼容性所必需的。可以相對于父元素的寬度和高度指定固定像素值或百分比。如果使用相對大小調整,可以通過處理 Content.Resized 事件對插件大小的更改做出響應。
type 屬性和顯示的特定值也是必需的。此值使用 Silverlight MIME 類型來標識插件和必需的版本。建議使用 data 屬性及其值,以避免某些瀏覽器出現性能問題。請注意數據值的尾隨逗號。它表示具有空值的第二個數據參數。名為 source 的 param 元素是必需的,該元素表示應用程序文件的位置和名稱。通常在相對于 HTML 文件的位置指定一個 .xap 應用程序包。
指定要在未安裝 Silverlight 時顯示的備用HTML
向子param元素后的object元素添加HTML內容。
<object id="SilverlightPlugin1" width="300" height="300" data="data:application/x-silverlight-2," type="application/x-silverlight-2" > <param name="source" value="SilverlightApplication1.xap"/> <!-- Display installation image. --> <a href="http://go.microsoft.com/fwlink/?LinkID=149156" style="text-decoration: none;"> <img src="http://go.microsoft.com/fwlink/?LinkId=108181" alt="Get Microsoft Silverlight" style="border-style: none"/> </a> </object>
該示例顯示了默認安裝映像源和安裝程序URI。使用這些URI,服務器可以檢測到用戶的瀏覽器設置以提供正確版本的安裝映像和安裝程序。如果用戶的瀏覽器不受支持,單擊映像可使瀏覽器打開Silverlight Requirements頁。
為了將Silverlight安裝體驗集成到網頁中,可以任意提供復雜的備用HTML。不過,在許多情況下,用戶必須在安裝 Silverlight 后重新啟動或刷新瀏覽器。對于 Internet Explorer 而言,只需要刷新瀏覽器,除非用戶安裝的是早期版本的Silverlight 并通過安裝鏈接升級。也可以自動刷新瀏覽器,或者通過使用Silverlight.js 文件中的幫助器功能取消刷新要求。還可以使用Silverlight.js 執行細化的瀏覽器要求檢測。
下面的代碼示例提供了使用整個瀏覽器窗口的Silverlight 應用程序的完整HTML頁。該示例基于當您選擇動態生成測試頁時Visual Studio 所使用的默認HTML。該示例使用級聯樣式表 (CSS) 和 div 元素來包含插件。這可以確保插件延伸到瀏覽器窗口的邊緣。此元素和其他附加到HTML 的元素有助于確保跨瀏覽器兼容。
iframe元素也用于確保跨瀏覽器兼容性。iframe 的存在可避免 Safari 瀏覽器緩存頁面。當用戶向后導航到以前訪問過的Silverlight 頁面時,Safari 緩存可避免重新加載Silverlight 插件。該示例使用JavaScript 函數處理插件的OnError 事件。JavaScript 錯誤處理程序在調試過程中很有用,但通常在部署應用程序時將其移除。
本示例還包含minRuntimeVersion 和autoUpgrade 設置以便在未安裝指定Silverlight 版本時提供升級體驗。若要在Web 瀏覽器窗口中查看該示例,必須在source 參數中指定有效的 Silverlight 應用程序包。
Silverlight嵌入HTML代碼
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html > <!-- saved from url=(0014)about:internet --> <head> <title>SilverlightApplication1</title> <style type="text/css"> html, body { height: 100%; overflow: auto; } body { padding: 0; margin: 0; } #silverlightControlHost { height: 100%; text-align:center; } </style> <script type="text/javascript"> function onSilverlightError(sender, args) { var appSource = ""; if (sender != null && sender != 0) { appSource = sender.getHost().Source; } var errorType = args.ErrorType; var iErrorCode = args.ErrorCode; if (errorType == "ImageError" || errorType == "MediaError") { return; } var errMsg = "Unhandled Error in Silverlight Application " + appSource + "\n"; errMsg += "Code: " + iErrorCode + " \n"; errMsg += "Category: " + errorType + " \n"; errMsg += "Message: " + args.ErrorMessage + " \n"; if (errorType == "ParserError") { errMsg += "File: " + args.xamlFile + " \n"; errMsg += "Line: " + args.lineNumber + " \n"; errMsg += "Position: " + args.charPosition + " \n"; } else if (errorType == "RuntimeError") { if (args.lineNumber != 0) { errMsg += "Line: " + args.lineNumber + " \n"; errMsg += "Position: " + args.charPosition + " \n"; } errMsg += "MethodName: " + args.methodName + " \n"; } throw new Error(errMsg); } </script> </head> <body> <div id="silverlightControlHost"> <object width="100%" height="100%" type="application/x-silverlight-2" data="data:application/x-silverlight-2," > <param name="source" value="SilverlightApplication1.xap"/> <param name="onerror" value="onSilverlightError" /> <param name="background" value="white" /> <param name="minRuntimeVersion" value="3.0.40620.0" /> <param name="autoUpgrade" value="true" /> <a href="http://go.microsoft.com/fwlink/?LinkID=149156" style="text-decoration: none;"> <img src="http://go.microsoft.com/fwlink/?LinkId=108181" alt="Get Microsoft Silverlight" style="border-style: none"/> </a> </object> <iframe id="_sl_historyFrame" style='visibility:hidden;height:0px;width:0px;border:0px'> </iframe> </div> </body> </html>
其實Silverlight程序是以控件的形式嵌入到HTML頁面中的,這里是把將要整合的HTML頁面利用iframe置于Silverlight控件之上,而不影響Silverlight控件的正常工作。
操作要點:1.編輯按鈕的xaml,定義MouseLeftButtonDown,使按下鼠標左鍵時,觸發相應函數。2.在該頁面的js文件中,關聯按鈕。
代碼:
function On_MouseLeftButtonDown(sender,args){ document.getElementById('iframe').style.visibility = "visible"; } //開啟HTML頁面,將名為iframe的隱藏層的visibility屬性改為visible顯示 function Off_MouseLeftButtonDown(sender,args){ document.getElementById('iframe').style.visibility = "hidden"; } //關閉HTML頁面,將名為iframe的隱藏層的visibility屬性改為hidden隱藏
3.該項目的html文件。
代碼:
<div id="iframe" style="position:absolute; width:640px; height:450px; z-index:1; left: 10px; top: 45px;visibility:hidden"><iframe scrolling="no" style="position:fixed; width:640px; height:450px;" src="http://www.mdong.org/qdjw" /> </div> // 將iframe嵌入一個div層,并通過調整z-index值與visibility屬性將該層置于Silverlight控件層上方并隱藏,以不影響Silverlight程序正常工作。//調整DIV層的位置大小。
上述就是小編為大家分享的Silverlight中怎么嵌入HTML了,如果剛好有類似的疑惑,不妨參照上述分析進行理解。如果想知道更多相關知識,歡迎關注億速云行業資訊頻道。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。