如何在 dijit.form.ComboBox 或 dijit.form.FilteringSelect 的▼符号处添加/替换一些图片
并且图片可以随着鼠标的移入和移出而切换。
以及如何更改 ComboBox 的弹出窗口的 bg-color。
(我需要像那个网站的原件一样复制。但是这个网站使用自定义小部件,所以我不知道如何获取源代码。)
如果有人知道如何自定义,请教我。谢谢。
最佳答案
更改 Dojo 小部件的外观是使用主题完成的。 http://dojotoolkit.org/reference-guide/1.7/dijit/themes.html
您可以在以下位置查看默认发布的主题 http://archive.dojotoolkit.org/nightly/dojotoolkit/dijit/themes/themeTester.html (注意:此页面基于夜间构建,因此有时会损坏)
使用 CSS 应用主题。
我会创建您自己的 CSS 样式表。
将主题名称添加到正文节点。
<body class="tundra myTheme">
您正在寻找的特定 css 是
.myTheme .dijitComboBox .dijitDownArrowButton {} /* The grey box */
.myTheme .dijitComboBox .dijitDownArrowButton .dijitArrowButtonInner { /* The arrow */
background: url(images/spriteArrows.png) no-repeat scroll 0 center;
}
/* Hover */
.myTheme .dijitComboBox .dijitDownArrowButtonHover {} /* The grey box */
.myTheme .dijitComboBox .dijitDownArrowButtonHover .dijitArrowButtonInner {} /* The arrow */
/* Active (mouse down) */
.myTheme .dijitComboBox .dijitDownArrowButtonActive {} /* The grey box */
.myTheme .dijitComboBox .dijitDownArrowButtonActive .dijitArrowButtonInner {} /* The arrow */
在浏览器中使用开发人员工具将帮助您确定要覆盖的 css 类。
关于css - 自定义 dojo 的 ComboBox,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10086869/