Question

为opensocial编写应用程序会带来以下问题：

我创建了一个对话框（css是tundra）

myDialog = new dijit.Dialog（{ 标题：＆＃34;我的对话＆＃34;，内容：＆＃34;测试内容＆＃34;，风格：＆＃34;宽度：300px＆＃34; }）;

如何更改属性＆＃34;溢出＆＃34;和/或＆＃34;身高＆＃34;的

＆＃34; dijitDialogPaneContent＆＃34;

创建此对象后，myDialog中包含

？

谢谢李苏滨

Answer 1

您可以使用多种方法，具体取决于解决方案的通用程度。

应用于所有对话框

如果你想对所有对话框应用相同的样式，你可以“扩展”一个主题，例如，通常你会像这样使用苔原主题：

<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" href="location/to/tundra.css" />
    </head>
    <body class="tundra">
        <!-- Your content comes here -->
    </body>
</html>

如果您要将其应用于所有对话框，您可以执行以下操作：

<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" href="location/to/tundra.css" />
        <link rel="stylesheet" href="custom/style.css" />
    </head>
    <body class="tundra custom">
        <!-- Your content comes here -->
    </body>
</html>

然后编写一个这样的自定义样式表：

.custom .dijitDialogPaneContent {
    overflow: hidden; /** Custom styles */
}

这将保证它将覆盖所有对话框的一般Tundra样式。如果您不使用像.custom这样的类，则无法覆盖Tundra样式表，因为.tundra .dijitDialogPaneContent将更具体（这意味着它具有更高的优先级）。

当然，您也可以在自定义样式表中编写.tundra .dijitDialogPaneContent。

通过样式表

应用于单个对话框

如果要将其应用于单个对话框，请为对话框指定ID，例如：

myDialog = new dijit.Dialog({
    title: "My Dialog",
    content: "test content",
    style: "width: 300px",
    id: "myDialogId"
});

然后你可以写一个这样的样式表：

#myDialogId .dijitDialogPaneContent {
    overflow: hidden; /** Custom styles */
}

应用于单个对话框（使用JavaScript）

单独的样式表可以提高可读性，因为您可以从设计中分离逻辑。如果您不需要单独的样式表，您可以执行以下操作：

require([ "dojo/query", "dojo/NodeList-dom" ], function(query) {
    // Your code
    query(".dijitDialogPaneContent", myDialog.domNode).style("overflow", "hidden");
});

这将使用对话框的domNode属性查询内容窗格，然后应用样式。

应用于多个对话框

如果要将相同的样式应用于多个对话框（但不是所有对话框），那么最好的方法是通过扩展默认对话框来创建自定义对话框。考虑到我的答案长度，我不打算详细解释，但我建议阅读有关writing your own widget的指南。

将内容添加到对话框DOJO

1 个答案:

应用于所有对话框

通过样式表

应用于单个对话框（使用JavaScript）

应用于多个对话框