代码拉取完成,页面将自动刷新
仅供参考
var d = dialog({
innerHTML: '<div i="dialog" class="ui-dialog">' +
'<div class="ui-dialog-arrow-a"></div>' +
'<div class="ui-dialog-arrow-b"></div>' +
'<table class="ui-dialog-grid">' +
'<tr>' +
'<td i="header" class="ui-dialog-header">' +
'<button i="close" class="ui-dialog-close">×</button>' +
'<button i="max" class="ui-dialog-max">放大</button>' +
'<button i="min" class="ui-dialog-min">缩小</button>' +
'<div i="title" class="ui-dialog-title"></div>' +
'</td>' +
'</tr>' +
'<tr>' +
'<td i="body" class="ui-dialog-body">' +
'<div i="content" class="ui-dialog-content"></div>' +
'</td>' +
'</tr>' +
'<tr>' +
'<td i="footer" class="ui-dialog-footer">' +
'<div i="statusbar" class="ui-dialog-statusbar"></div>' +
'<div i="button" class="ui-dialog-button"></div>' +
'</td>' +
'</tr>' +
'</table>' +
'</div>',
title: '欢迎',
content: '欢迎使用 artDialog 对话框组件!'
});
d.show()
d._$('max').on('click', function(e) {
d._popup.removeClass('min')
d._$('min').text('缩小')
d._popup.toggleClass('max')
if (d._popup.hasClass('max')) {
this.innerText = '恢复'
} else {
this.innerText = '放大'
}
})
d._$('min').on('click', function(e) {
d._popup.removeClass('max')
d._$('max').text('放大')
d._popup.toggleClass('min')
if (d._popup.hasClass('min')) {
this.innerText = '恢复'
d._$('body').hide()
} else {
this.innerText = '缩小'
d._$('body').show()
}
})
.ui-dialog-max, .ui-dialog-min {
position: relative;
_position: absolute;
float: right;
top: 13px;
right: 13px;
_height: 26px;
padding: 0 4px;
font-weight: bold;
font-size: 14px;
line-height: 25px;
color: #000;
text-shadow: 0 1px 0 #FFF;
opacity: .2;
filter: alpha(opacity=20);
cursor: pointer;
background: transparent;
_background: #FFF;
border: 0;
-webkit-appearance: none;
}
.ui-dialog-max:hover, .ui-dialog-min:hover,
.ui-dialog-max:focus, .ui-dialog-min:focus {
color: #000000;
text-decoration: none;
cursor: pointer;
outline: 0;
opacity: 0.5;
filter: alpha(opacity=50);
}
.ui-popup-show.max {
width: 100% !important;
height: 100% !important;
left: 0 !important;
top: 0 !important;
}
.ui-popup-show.max .ui-dialog-grid {
width: 100%;
height: 100%;
}
.ui-popup-show.min {
width: auto !important;
left: auto !important;
top: auto !important;
bottom:0;
right:0;
}
.ui-popup-show.min .ui-dialog-grid {
width: auto;
height: 0%;
}
.ui-dialog-title {
padding-right: 40px;
}
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。
登录 后才可以发表评论