dwz拓展官方例子图标（博客开始运营，求关注）

摘要: 说明：使用dwz快速开发的时候，发现官网给出的图标才几个，根本不够用，现在我们一起来进行图标拓展，非常的简单。也建议dwz官方把这段代码加进去，这样才能满足我们的需求。

一、找到项目文件dwz.ui.js，在js的最后添加图标扩展代码：

/**
* 自动加载toolbar的图片，iconClass=contexPath#imageName
*/
function readyToolbarCSS() {
var $a = $("a[iconClass]");
$a.each(function(){
var imageName = $(this).attr("iconClass");
var $span = $("span", this);
if ($span.length == 0) {
// 用作<td>中的<a>
$(this).css({
"background":"url(../style/img/toolbar_icons/" + imageName + ".png) no-repeat",
"background-position":"50% 50%",
"width":"22px",
"height":"20px",
"text-indent":"-1000px",
"overflow":"hidden",
"display":"block",
"float":"left"
});
} else {
// 用作panelBar toolBar中的<span>
$span.css({
"background-image":"url(../style/img/toolbar_icons/" + imageName + ".png)",
"background-position": "0 3px"
});
}
});  &n
3ff0
bsp;
}

二、在上面“// 这里放其他第三方jQuery插件...”下添加下面代码

// 自动加载toolbar的图片
readyToolbarCSS();

三、要使用图标就可以在a标签中使用如下代码，就能实现图标拓展：

iconClass="database_go"

其中“database_go”为图标名称

四、这样就能完成图标的拓展或者是插入图标，除开dwz，其他的前台页面要使用图标都可以这样使用。效果如下：



博客声明：

————————————— 欢迎大家一起交流，多评论、多留言、多关注——————————————

——————————————如有侵权请及时说明，转载请说明作者和出处 ————————————