javascript - 将 dijit.TitlePane 转换为下拉按钮

Question

我有一个使用 javascript API 构建的应用程序，并在标题中创建了 3 个标题 Pane ，打开后可显示信息( basemap 库、图例、图层)。它的功能完全按照我想要的方式运行，现在我想通过为每个 Pane 提供自己的图像来使其“看起来很漂亮”，当您单击该图像时，它会以相同的方式打开该 Pane 。

我尝试过重写 CSS，但是这给所有标题 Pane 提供了相同的图像。看来我需要将标题 Pane 转换为切换按钮。阅读一些示例后，我发现除了 html 更改之外，我还需要添加其他代码。有进行此编辑的最佳方法吗？

这是创建标题 Pane 的 html 示例，“basemapGallery”div 是 Pane 内的信息，我希望在其中创建下拉菜单或可以控制图像的任何其他类型的按钮。

<div dojoType="dijit.TitlePane" title="Switch Basemap" closable="false" open="false" style="float:right; margin-right:10px;">
                <div dojoType="dijit.layout.ContentPane"  style="width:275px; height:560px; overflow:auto;">
         <div id="basemapGallery"></div>
                </div>
  </div>

标题有一个灰色矩形框，我希望它是一个图像，您在其中单击图像，它会打开按钮内的内容。

编辑最终目标是使按钮与标题中的按钮具有相似的外观和感觉: http://localgovtemplates2.esri.com/ParkFinder/default.htm

Answer 1

我最终通过引用 fx.toggler 的旧帖子找到了一些帮助。工作起来就像一个魅力。现在只是按照我想要的方式设计它，但基本功能已经存在。