Question

我在页面上有一个HTML表格，它嵌入了一个小小的Silverlight应用程序，以提供跨浏览器的“复制到剪贴板”功能。整个“app”是一个单独的按钮，可以将值从嵌入它的行复制到剪贴板。我还在页面的其他区域使用jQueryUI Dialog小部件。当对话框打开时，它将显示在页面上除那些Silverlight按钮之外的所有其他内容之上。出于某种原因，我无法将模态对话框置于这些按钮之上，这显然是一个很大的可用性问题。

我做了很多研究，还没有找到有效的解决方案。我确信这个问题源于我对Silverlight与DOM的关系以及它如何影响布局和样式的深入理解。

我尝试了几件事，包括将“无窗口”属性设置为true，将背景设置为“透明”，我还在博客上找到了一些样式解决方法。遗憾的是没有任何效果。

以下是用于为每行实例化Silverlight插件的代码。

Silverlight.createObjectEx({
    "source": src,
    "parentElement": cell,
    "id": String.format("pluginHost_{0}", id),
    "properties": {
        "height": "16",
        "width": "16",
        "background": "transparent",
        "windowless": true,
        "enableHtmlAccess": true,
        "version": "4.0.50826.0"
    },
    "events": {
        "onLoad": null,
        "onError": null
    },
    "initParams": String.format("url={0}", item.Url),
    "context": null
});

正如我之前所说的，它只是一个小的（16px）按钮，它从相关数据行获取一个URL作为初始化参数，并在按下按钮时将其复制到剪贴板。因为数据是通过外部Web服务动态加载的，所以我使用Silverlight.js库加载插件，这样我就可以在每行初始化插件时传入数据。

有谁可以告诉我为什么我的表格中的按钮显示在模态对话框的顶部（以及我在桌面上移动的任何其他元素）？

以下是我所看到的截图。

enter image description here

谢谢！

Answer 1

我遇到了类似的问题，我试图在silverlight容器上显示gif进度图像。为此，我有一个预先编写的JavaScript。它没有按预期工作，因为Silverlight总是习惯于在网页中的其他元素的顶部。

我尝试了以下对我有用的方法：

在您的网页中添加以下用于创建silverlight对象的位置：

<param name="windowless" value="true" />

示例：

<div id="silverlightControlHost">
  <object id="SilverlightObject" data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="800" height="500" style="z-index:1" >
    <param name="source" value="ClientBin/GIF2.xap"/>
    <param name="onError" value="onSilverlightError" />
    <param name="windowless" value="true" />
    <param name="background" value="white" />
    <param name="minRuntimeVersion" value="4.0.50826.0" />
    <param name="autoUpgrade" value="true" />
    <a href="http://go.microsoft.com/fwlink/?LinkID=149156&v=4.0.50826.0" style="text-decoration:none">
      <img src="http://go.microsoft.com/fwlink/?LinkId=161376" alt="Get Microsoft Silverlight" style="border-style:none"/>
    </a>
  </object>
</div>

除了上面的参数之外，我还必须使用z-index属性。

要显示另一个，我只需根据需要使用javascript更改其z-index。

示例：

var divelement = document.getElementById("element_to_be_on_top");
divelement.style.zIndex = 999;

参考： http://weblogs.asp.net/dwahlin/archive/2010/05/10/integrating-html-into-silverlight-applications.aspx

Silverlight内容显示在HTML内容之上

1 个答案: