artDialog的修改记录

2024-02-09 08:32
文章标签 记录 修改 artdialog

本文主要是介绍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; }

完成


这篇关于artDialog的修改记录的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/693713

相关文章

在Spring Boot中集成RabbitMQ的实战记录

《在SpringBoot中集成RabbitMQ的实战记录》本文介绍SpringBoot集成RabbitMQ的步骤,涵盖配置连接、消息发送与接收,并对比两种定义Exchange与队列的方式:手动声明(... 目录前言准备工作1. 安装 RabbitMQ2. 消息发送者(Producer)配置1. 创建 Spr

k8s上运行的mysql、mariadb数据库的备份记录(支持x86和arm两种架构)

《k8s上运行的mysql、mariadb数据库的备份记录(支持x86和arm两种架构)》本文记录在K8s上运行的MySQL/MariaDB备份方案,通过工具容器执行mysqldump,结合定时任务实... 目录前言一、获取需要备份的数据库的信息二、备份步骤1.准备工作(X86)1.准备工作(arm)2.手

SpringBoot3应用中集成和使用Spring Retry的实践记录

《SpringBoot3应用中集成和使用SpringRetry的实践记录》SpringRetry为SpringBoot3提供重试机制,支持注解和编程式两种方式,可配置重试策略与监听器,适用于临时性故... 目录1. 简介2. 环境准备3. 使用方式3.1 注解方式 基础使用自定义重试策略失败恢复机制注意事项

SQL Server修改数据库名及物理数据文件名操作步骤

《SQLServer修改数据库名及物理数据文件名操作步骤》在SQLServer中重命名数据库是一个常见的操作,但需要确保用户具有足够的权限来执行此操作,:本文主要介绍SQLServer修改数据... 目录一、背景介绍二、操作步骤2.1 设置为单用户模式(断开连接)2.2 修改数据库名称2.3 查找逻辑文件名

Python UV安装、升级、卸载详细步骤记录

《PythonUV安装、升级、卸载详细步骤记录》:本文主要介绍PythonUV安装、升级、卸载的详细步骤,uv是Astral推出的下一代Python包与项目管理器,主打单一可执行文件、极致性能... 目录安装检查升级设置自动补全卸载UV 命令总结 官方文档详见:https://docs.astral.sh/

统一返回JsonResult踩坑的记录

《统一返回JsonResult踩坑的记录》:本文主要介绍统一返回JsonResult踩坑的记录,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录统一返回jsonResult踩坑定义了一个统一返回类在使用时,JsonResult没有get/set方法时响应总结统一返回

Go学习记录之runtime包深入解析

《Go学习记录之runtime包深入解析》Go语言runtime包管理运行时环境,涵盖goroutine调度、内存分配、垃圾回收、类型信息等核心功能,:本文主要介绍Go学习记录之runtime包的... 目录前言:一、runtime包内容学习1、作用:① Goroutine和并发控制:② 垃圾回收:③ 栈和

Oracle修改端口号之后无法启动的解决方案

《Oracle修改端口号之后无法启动的解决方案》Oracle数据库更改端口后出现监听器无法启动的问题确实较为常见,但并非必然发生,这一问题通常源于​​配置错误或环境冲突​​,而非端口修改本身,以下是系... 目录一、问题根源分析​​​二、保姆级解决方案​​​​步骤1:修正监听器配置文件 (listener.

java对接海康摄像头的完整步骤记录

《java对接海康摄像头的完整步骤记录》在Java中调用海康威视摄像头通常需要使用海康威视提供的SDK,下面这篇文章主要给大家介绍了关于java对接海康摄像头的完整步骤,文中通过代码介绍的非常详细,需... 目录一、开发环境准备二、实现Java调用设备接口(一)加载动态链接库(二)结构体、接口重定义1.类型

Linux中修改Apache HTTP Server(httpd)默认端口的完整指南

《Linux中修改ApacheHTTPServer(httpd)默认端口的完整指南》ApacheHTTPServer(简称httpd)是Linux系统中最常用的Web服务器之一,本文将详细介绍如何... 目录一、修改 httpd 默认端口的步骤1. 查找 httpd 配置文件路径2. 编辑配置文件3. 保存