artDialog的修改记录

1.添加窗口缩小及放大按钮

第一步:窗口按钮的回调函数在把里面的修改为

// 按钮回调函数触发
_click: function (name) {
var that = this,
fn = that._listeners[name] && that._listeners[name].callback;

if(name=='aui_close'){ //关闭
return that.close();
}
else if(name=='aui_reduce'){ //缩小
that.hide();
return;
}
else if(name=='aui_amplify'){
if(that._width=='100%'){
that.size('auto', 'auto');
that.position('50%', '38.2%');
}
else{
that.position('0%', '0%');
that.size('100%', '100%');
}
return;

}
else
{
return typeof fn !== 'function' || fn.call(that, window) !== false ?
that.close() : that;
}
},

第二步:修改监听绑定

// 监听点击
DOM.wrap
.bind('click', function (event) {
var target = event.target, callbackID;

if (target.disabled) return false; // IE BUG

if((target.className == "aui_close")||(target.className == "aui_reduce")||(target.className == "aui_amplify")){ //这里加入css类识别
//if (target === DOM.close[0]) {
that._click(target.className);
return false;
} else {
callbackID = target[_expando + 'callback'];
callbackID && that._click(callbackID);
};

that._ie6SelectFix();
})
.bind('mousedown', function () {
that.zIndex();
});

第三步:在生成默认html层时

artDialog._templates =
'<div class="aui_outer">'

........

+ '<td colspan="2" class="aui_header">'
+ '<div class="aui_titleBar">'
+ '<div class="aui_title"></div>'
+ '<a class="aui_close" href="javascript:/*artDialog*/;">'
+ '\xd7'
+ '</a>'
+ '<a class="aui_reduce" href="javascript:/*artDialog*/">'
+ '\x2d'
+ '</a>'
+ '<a class="aui_amplify" href="javascript:/*artDialog*/">'
+ '\x2b'
+ '</a>'
+ '</div>'
+ '</td>'

.......

第四步,修改相应的CSS文件,找到 .aui_close 的样式,在其后面加入aui_reduce aui_amplify的样式

.aui_close, .aui_reduce, .aui_amplify  { display:block; position:absolute; text-decoration:none; outline:none; _cursor:pointer; }
.aui_close:hover, .aui_reduce:hover, .aui_amplify:hover  { text-decoration:none; }

.aui_close { padding:0; top:2px; right:5px; width:21px; height:21px; line-height:21px; font-size:18px; text-align:center; color:#8D8D8D;; font-family: Helvetica, STHeiti; _font-family: Tahoma, '\u9ed1\u4f53', 'Book Antiqua', Palatino; border:1px solid transparent; _border:0 none; background:#fff; border-radius:15px;  }
.aui_reduce { padding:0; top:2px; right:31px; width:21px; height:21px; line-height:21px; font-size:18px; text-align:center; color:#8D8D8D; font-family: Helvetica, STHeiti; _font-family: Tahoma, '\u9ed1\u4f53', 'Book Antiqua', Palatino; border:1px solid transparent; _border:0 none; background:#fff; border-radius:15px;  }
.aui_amplify { padding:0; top:2px; right:57px; width:21px; height:21px; line-height:21px; font-size:18px; text-align:center; color:#8D8D8D; font-family: Helvetica, STHeiti; _font-family: Tahoma, '\u9ed1\u4f53', 'Book Antiqua', Palatino; border:1px solid transparent; _border:0 none; background:#fff; border-radius:15px;  }
.aui_state_drag .aui_close, .aui_state_drag .aui_reduce, .aui_state_drag .aui_amplify { color:#FFF; }
.aui_close:hover, .aui_reduce:hover, .aui_amplify:hover  { background:#CDCDCD; border:1px solid #fff; _border:0 none; box-shadow: 0 1px 0 rgba(41, 127, 184, .3), inset 0 1px 0 rgba(41, 127, 184, .3); }
.aui_close:active, .aui_reduce:active, .aui_amplify:active { box-shadow: none; }

.aui_state_noTitle .aui_close, .aui_state_noTitle .aui_reduce, .aui_state_noTitle .aui_amplify  { top:5px; }

完成


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值