Description
The following code example provides a complete HTML page for a Silverlight application that uses the entire browser window. This example is based on the default HTML used by Visual Studio when you choose to dynamically generate a test page.
This example uses cascading style sheets (CSS) and a div element to contain the plug-in. This ensures that the plug-in extends to the edges of the browser window. This and other additions to the HTML help ensure cross-browser compatibility.
Note: |
|---|
Because of browser differences, the Silverlight plug-in does not support the cascading style sheets (CSS) overflow property on the object element or on a parent container element, such as a div element. |
The iframe element is also for cross-browser compatibility. The presence of the iframe prevents the Safari browser from caching the page. Safari caching prevents the Silverlight plug-in from reloading when the user navigates back to a previously-visited Silverlight page. For more information, see the Safari Developer FAQ.
This example uses a JavaScript function to handle the plug-in's OnError event. A JavaScript error handler is useful during debugging, but you typically remove it when you deploy your application.
This example also includes minRuntimeVersion and autoUpgrade settings to provide an upgrade experience if the specified version of Silverlight is not installed. For more information, see Silverlight Versioning.
To view this example in your Web browser window, you must specify a valid Silverlight application package in the source parameter. For more information, see How to: Create a New Silverlight Project.
Code
<!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%;
}
</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;
var errMsg = "Unhandled Error in Silverlight 2 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="2.0.31005.0" />
<param name="autoUpgrade" value="true" />
<a href="http://go.microsoft.com/fwlink/?LinkID=124807"
style="text-decoration: none;">
<img src="http://go.microsoft.com/fwlink/?LinkId=108181"
alt="Get Microsoft Silverlight"
style="border-style: none"/>
</a>
</object>
<iframe style='visibility:hidden;height:0;width:0;border:0px'></iframe>
</div>
</body>
</html>