Silverlight 应用程序的浏览器滚动条问题。（Html）答案

【问题标题】：Browser scrollbars problem with silverlight application.(Html)Silverlight 应用程序的浏览器滚动条问题。（Html）
【发布时间】：2011-01-29 11:41:32
【问题描述】：

我有一个简单的 Silverlight 应用程序，我需要为其添加 Web 浏览器滚动条。（滚动条不在我的 silverlight 应用程序中）

所以我有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>

我面临下一个问题：启用滚动条时，垂直滚动条无法正常工作 silverlight 应用程序不适合页面内容。（屏幕上的红色箭头显示没有silverlight应用程序的区域）我现在不知道如何解决这个问题。宽度正常。 Silverlight 应用程序内部内容设置为拉伸

图片：

如有任何信息，我将不胜感激

【问题讨论】：

标签： html css silverlight

【解决方案1】：

我们在 IE 和 Chrome 中遇到了同样的问题，并使用 Javascript 解决了它：

将以下 Javascript 添加到您的 Silverlight 测试页。

window.onload = resizeObject;
window.onresize = resizeObject;
function resizeObject() {
    var height = document.getElementById('silverlightControlHost').offsetHeight;
    document.getElementById('silverlightObject').height = height;
}

为您的 OBJECT 标签指定 ID 'silverlightObject'。

<object id="silverlightObject" data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="100%" height="100%">
</object>

测试一下。

【讨论】：

一位同事向我提到，我们还必须调整宽度以避免出现水平滚动条。

【解决方案2】：

您是否尝试过设置溢出：自动；在 div #silverlightControlHost 样式中？并从 html,body 中删除该属性

【讨论】：

好吧，也许我的问题错了..你想达到什么目的？你想让 div #silverlightControlHost 根据嵌入的对象尺寸滚动，是吗？
高度滚动减少了应用程序的一半。当浏览器有垂直滚动时，应用程序不适合内容。

【解决方案3】：

与屏幕截图相比，#silverlightControlHost css 中的 min-height 和 min-width 值看起来非常大。

您是否尝试过更改它们的值（或完全删除它们）来测试它是否会影响显示？

如果您的div 大于您的浏览器窗口（从您的评论看来是），那么这将解释滚动条。使div 的最小尺寸更小（如果可以的话）。

【讨论】：

最小尺寸为 640x480 时在屏幕上拍摄。没有最小值的应用程序看起来很完美，但没有滚动条......并且宽度正常（只是silverlight应用程序内的白色内容页面）！身高我有问题
@Evgeny - 这可以解释。您的 div 大于屏幕尺寸，因此出现滚动条。
对不起，我不明白。我的应用程序需要滚动条，但垂直滚动条（高度）裁剪 silverlight 应用程序，我可以滚动但应用程序被裁剪...
@Evgeny - 在这种情况下，我想我错过了你的问题的重点。
我在描述中添加了一些图片，请看一下。

【解决方案4】：

我设法仅使用 CSS 解决了这个问题，只将这些 CSS 行添加到我的网站：

body
{
   padding:0px;
   margin:0px;
   overflow:hidden;
}

.silverlightControlHost
{
   height:100%;
}

html, body 
{ 
   height: 100% 
}

当然，假设持有 silverlight html 对象的 div 具有分配的类“silverlightControlHost”

【讨论】：