I have a simple silverlight application and i need to add the web browser scroll bars for it. (scroll bars not inside my silverlight app)
So I have html:
<style type="text/css">
html, body {
height: 100%;
overflow: auto;
}
body {
padding: 0;
margin: 0;
}
#silverlightControlHost {
height: 100%;
min-height:600px;
min-width:800px;
text-align:center;
}
</style><body>
<form id="form1" runat="server" style="height:100%">
<div id="silverlightControlHost">
<object data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="100%" height="100%">
<param name="source" value="ClientBin/Infopulse.MobileOptimizer.xap"/>
<param name="onError" value="onSilverlightError" />
<param name="background" value="white" />
<param name="minRuntimeVersion" value="4.0.50401.0" />
<param name="autoUpgrade" value="true" />
<param name="culture" value="ru-ru" />
<param name="uiculture" value="ru-ru" />
<a href="http://go.microsoft.com/fwlink/?LinkID=149156&v=4.0.50401.0" style="text-decoration:none">
<img src="http://go.microsoft.com/fwlink/?LinkId=161376" 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>
</form>
</body>
And i faced with next problem: vertical scroll bar works not properly when scroll bar is enabled silverlight application not fits content of page. (Red arrow on screen shows the area without silverlight application) I dont now how to solve this problem. Width fits normally. Inside silverlight application content set to stretch
Image:
I will be grateful for any information
We had the same problem in IE and Chrome and solved it using Javascript:
Add the following Javascript to your Silverlight test page.
window.onload = resizeObject;
window.onresize = resizeObject;
function resizeObject() {
var height = document.getElementById('silverlightControlHost').offsetHeight;
document.getElementById('silverlightObject').height = height;
}
Give your OBJECT tag the ID 'silverlightObject'.
<object id="silverlightObject" data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="100%" height="100%">
</object>
Test it.
Have you tried putting a overflow:auto; in div #silverlightControlHost style? and remove the property from html,body
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With