I have developed a Silverlight website. The problem i am facing currently is when i use the browser zoom, it displays the magnified version of the site without browser scrollbars. The content is clipped.
Please check these images which displays my problem.
http://demo.digi-corp.com/withzoom.jpg
http://demo.digi-corp.com/withoutzoom.jpg
The following is the design code in my aspx page where the silverlight object is hosted.
<form id=”form1″ runat=”server” style=”height: 100%;”>
<div id=”silverlightControlHost” style=”background: #9EEE69;”>
<object id=”silverlightObject” data=”data:application/x-silverlight-2,” type=”application/x-silverlight-2″
width=”100%” height=”100%”>
html, body
{
height: 100%;
width:100%;
overflow:auto;
}
body
{
padding: 0;
margin: 0;
}
#silverlightControlHost
{
height: 100%;
text-align: left;
width: 100%;
}
create javascript function
function bodyLoadEvent()
{
this.form1.style.height = (parseInt(document.body.offsetHeight) – 5).toString() + “px”;
this.form1.style.width = (parseInt(document.body.offsetWidth) – 5).toString() + “px”;
document.getElementById(“myhtmlbody”).style.height = (parseInt(document.body.offsetHeight) – 5).toString() + “px”;
document.getElementById(“myhtmlbody”).style.width= (parseInt(document.body.offsetWidth) – 5).toString() + “px”;
}
and call this function on body load.
i.e.
<body onload=”bodyLoadEvent();”>
<form id=”form1″ runat=”server” style=”height:100%;”>
…….
</form>
</body>