Silverlight site browser zoom problem

advertisements

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>