dojo tabContainer title(label)

时间:2012-11-27 00:54:42

标签: dojo title tabcontainer

所有我都有一个带有tiltes(Label)的tabContainer,我需要实现的是当点击一个标签时我想要将颜色更改为红色或任何有效的意思,剩下的非活动标签可能会保持黑色默认颜色。我尝试在网上搜索,我看到的唯一解决方案是css with class .tabLabel {color:Red;},它将所有标签标题更改为红色也尝试了onShow事件,它可以响应警报事件但不响应样式表。此外,如果您在tabcontainer中有id并使用dojo javascript应用css,它会更改选项卡中的内容而不是标题。这里是我从dojo获得的示例代码,以显示我想要实现的目标。

    <!DOCTYPE html>
<html >
<head>

    <link rel="stylesheet" href="../../_static/js/dojo/../dijit/themes/claro/claro.css">

<script>dojoConfig = {parseOnLoad: true}</script><script src='../../_static/js/dojo/dojo.js'></script><script>require(["dojo/parser", "dijit/layout/TabContainer", "dijit/layout/ContentPane"]);</script>
</head>
<body class="claro">
    <div style="width: 350px; height: 300px">
    <div data-dojo-type="dijit/layout/TabContainer" style="width: 100%; height: 100%;">
        <div data-dojo-type="dijit/layout/ContentPane" title="My first tab" data-dojo-props="selected:true">
            Lorem ipsum and all around...
        </div>
        <div data-dojo-type="dijit/layout/ContentPane" title="My second tab">
            Lorem ipsum and all around - second...
        </div>
        <div data-dojo-type="dijit/layout/ContentPane" title="My last tab" data-dojo-props="closable:true">
            Lorem ipsum and all around - last...
        </div>
    </div>
</div>
</body>
</html>

从上面的代码中我想使用不同颜色的文本以及默认颜色的其他选项卡激活title =“我的第一个选项卡”,当单击我的第二​​个选项卡使其激活并执行与第一个相同的操作时网站上的菜单链接。 请帮忙。感谢

1 个答案:

答案 0 :(得分:2)

您可以通过添加此类来更改活动标签的文本颜色。

.dijitChecked.dijitTab .tabLabel {
    color:red;
}

Here is an example.

相关问题