Question

这个问题与this one类似，但我仍然无法找到合适的解决方案。

在我的网站上，我正在尝试实现dojo Tooltip（不是上面链接中的对话框;单击here以查看Tooltip文档）。我希望能够将Tooltip的zIndex更改为我需要的任何内容。如果我使用http://ajax.googleapis.com/ajax/libs/dojo/1.10.0/dojo/dojo.js或//cdnjs.cloudflare.com/ajax/libs/dojo/1.9.3/dojo.js等CDN，我似乎只能让Dojo工作，所以试图改变javascript Tooltip.js的工具提示文件似乎没有做任何事情。注意：Tooltip.js在本地包含为：

<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.10.0/dojo/dojo.js"></script>
<script src="dojo/Tooltip.js"></script>

使用页面顶部链接中的信息，我能够提出一个黑客解决方案。假设Dojo工具提示的默认z-index为1000，我将所有其他div（以前> 1000）的z-indices更改为z-index＆lt; 1000.这解决了问题，现在可以在这些div之前看到Dojo工具提示（之前已经落后了）。

有关如何在不改变Tooltip.js的情况下更改Dojo工具提示的zIndex属性的任何建议？

Answer 1

不确定我是否完全理解您的问题。但也许这有助于使用javascript以编程方式更改dojo对象的z-index：

dijit.byId('<Dojo ID of Tooltip>').attr("style","z-index:999");

我也不会改变Tooltip.js。

Answer 2

我建议根据您的要求覆盖css规则。

默认情况下，dijit工具提示的默认css规则如下：

.dijitTooltip {
   position: absolute;
   z-index: 2000; // You can write your desired z-index
   display: block;
   left: 0;
   top: -10000px;
   overflow: visible;
}

或者你可以通过JS试试

dojo.query(".dijitTooltip:visible").style("z-index", 'You desired value'); // <1.6

//>1.7
require(["dojo/query","dojo/dom-style"],function(query, domStyle){
    domStyle(query(".dijitTooltip:visible"), "z-index", "You desired value");
});

Answer 3

对于dojo 1.10，您可以使用dom-attr来设置/更改样式。

上面的代码将如下所示：

domAttr.set("mywidgetId","style","z-index:999");

此致，Miriam

Answer 4

我建议使用dojo / dom-style。

domStyle.set(tooltip.domNode, "zIndex", "999");

请注意FireFox不会接受＆＃34; z-index＆＃34;作为有效的css属性名称，请参阅http://www.w3schools.com/jsref/dom_obj_style.asp。总是来css属性名称。

更改z Dojo工具提示的索引

4 个答案: