Home/ Questions/Q 80977
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-10T21:23:14+00:00

Is there any way to dock a Silverlight control to the browser window? For

  • 0

Is there any way to ‘dock’ a Silverlight control to the browser window? For example, I’d like to have an HTML header at the top of a page and then have the Silverlight control take up precisely the rest of the window, neatly resizing whenever the window is resized.

The default page Visual Studio creates uses styles with 100% widths and heights to make the Silverlight control take up the entire window. And I can easily modify that template to split the page by percent (say 20% HTML header and 80% Silverlight control). But what I really want is the header height to be static and the Silverlight control to take up 100% of the remaining window.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Here’s a solution in JavaScript. First, you create this function: 

    <script type='text/javascript'>     function resizeSLHost()     {         var docHeight = document.body.offsetHeight;         var pluginHeight = docHeight - 130;         var slplugin = document.getElementById('silverlightControlHost');         slplugin.style.height = pluginHeight + 'px';     } </script>

    Then, in your opening body tag, you say:

    <body onload='resizeSLHost()' onresize='resizeSLHost()'>

    And you place your header div right before the Silverlight host div:

    <div id='header' style='height:130px'></div> <div id='silverlightControlHost'>     <object data='data:application/x-silverlight-2' type='application/x-silverlight-2' width='100%' height='100%'>         // the usual stuff here...     </object>     <iframe style='visibility:hidden;height:0;width:0;border:0px'></iframe> </div>

    Of course, the number you subtract from docHeight in resizeSLHost() must be equal to the height of the header div.

    That worked for me in IE 7 and Firefox 3.0.4.

    • 0