基于Jquery的仿Windows Aero弹出窗(漂亮的关闭按钮)


Posted in Javascript onSeptember 28, 2010

今天介绍的Jquery Dialog Plugins AeroWindow ,是其中最个性的一款,因为他拥有神似Windows 7 Aero效果的肉身。

效果图:
基于Jquery的仿Windows Aero弹出窗(漂亮的关闭按钮)
演示:

官方演示 本地演示

特点
独特: 窗口移动时标题栏反光效果
窗口按钮:最小化,减少,最大化和关闭
双击窗口标题栏最大化,缩小
活动窗口突出显示
更改窗口大小(resize)
鼠标拖拽窗口
N多个配置选项
配置选项
窗口标题
窗口的起始位置的X / Y
窗口大小
最小的窗口大小
打开窗口的可用状态(最小化,最大化,正常)
窗口动画(30个不同的绚丽效果)
窗口可用函数,鼠标事件和JavaScript调用
在下面的兼容性测试浏览器
Internet Explorer 6
Internet Explorer 7
Internet Explorer 8
火狐3
谷歌浏览器4
苹果Safari 4
Opara10
使用起来是非常简单滴
来吧 让你现有的网站窗口以Windows Aero效果展现。

最简单的使用方法:

$('#YourContainerDiv').AeroWindow({ 
WindowTitle: 'My first very cool Aero Window for Web', 
});

自定义配置:

$('#YourContainerDiv').AeroWindow({ 
WindowTitle: 'My first cool Aero Window for Web', 
WindowPositionTop: 'center', 
WindowPositionLeft: 'center', 
WindowWidth: 600, 
WindowHeight: 400, 
WindowMinWidth: 100, 
WindowMinHeight: 100, 
WindowAnimationSpeed: 500, 
WindowAnimation: 'easeOutCubic',//窗口打开时的动画效果 
WindowResizable: true, 
WindowDraggable: true, 
WindowMinimize: true, 
WindowMaximize: false, 
WindowClosable: true 
});

包含所有必要的文件和演示文件。这个版本基于jQuery(v1.4.2)

官方下载地址: » AeroWindow(v3.5)
本站下载地址: AeroWindow 基于jquery的仿Windows Aero弹出窗

另附上生活流 页面的关于使用AeroWindow插件的代码

//javascript脚本 
$(document).ready(function() { 
$('#profilactic a').click(function() { 
var go=$(this); 
$('#mywindows').attr('src',go.attr('href')) 
go.attr('href','javascript:void(0);'); 
$('#Firefoxapp').AeroWindow({ 
WindowTitle: '向晚的'+go.attr('class'), 
WindowPositionTop: 'center', 
WindowPositionLeft: 'center', 
WindowWidth: 1000, 
WindowHeight: 500, 
WindowAnimation: 'easeOutCubic' 
}); 
$('html,body').animate({scrollTop: '0px'}, 300); 
return false; 
}); 
}); 
//弹出窗口容器 
<DIV id=Firefoxapp style="DISPLAY: none"> 
<iframe style="border-right-width: 0px; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" id="mywindows" height="99.5%" src="" frameborder="0" width="100%"></iframe> 
<DIV id=iframeHelper></DIV> 
</DIV>

需要的朋友可以参考下。
Javascript 相关文章推荐
JavaScript 保存数组到Cookie的代码
Apr 14 Javascript
javascript实现文本域写入字符时限定字数
Feb 12 Javascript
js实现黑色简易的滑动门网页tab选项卡效果
Aug 31 Javascript
js仿QQ中对联系人向左滑动、滑出删除按钮的操作
Apr 07 Javascript
Node.js用readline模块实现输入输出
Dec 16 Javascript
前端主流框架vue学习笔记第一篇
Jul 26 Javascript
react路由配置方式详解
Aug 07 Javascript
微信小程序之发送短信倒计时功能
Aug 30 Javascript
vue-cli启动本地服务局域网不能访问的原因分析
Jan 22 Javascript
简单了解小程序+node梳理登陆流程
Jun 24 Javascript
Vue el-autocomplete远程搜索下拉框并实现自动填充功能(推荐)
Oct 25 Javascript
Vue-cli打包后部署到子目录下的路径问题说明
Sep 02 Javascript
jquery控制listbox中项的移动并排序的实现代码
Sep 28 #Javascript
JQuery UI DatePicker中z-index默认为1的解决办法
Sep 28 #Javascript
13个绚丽的Jquery 界面设计网站推荐
Sep 28 #Javascript
基于Jquery的动态添加控件并取值的实现代码
Sep 24 #Javascript
封装的原生javascript弹出层代码
Sep 24 #Javascript
js最简单的拖拽效果实现代码
Sep 24 #Javascript
JavaScript 设计模式 安全沙箱模式
Sep 24 #Javascript
You might like
php 文件状态缓存带来的问题
2008/12/14 PHP
浅析php中抽象类和接口的概念以及区别
2013/06/27 PHP
php 读取输出其他文件的实现方法
2016/07/26 PHP
php 三元运算符实例详细介绍
2016/12/15 PHP
php使用PDO从数据库表中读取数据的实现方法(必看)
2017/06/02 PHP
Laravel框架自定义验证过程实例分析
2019/02/01 PHP
laravel请求参数校验方法
2019/10/10 PHP
javascript语句中的CDATA标签的意义
2007/05/09 Javascript
document.designMode的功能与使用方法介绍
2007/11/22 Javascript
Javascript 继承实现例子
2009/08/12 Javascript
改善用户体验的五款jQuery插件分享
2011/05/22 Javascript
解析Javascript小括号“()”的多义性
2013/12/03 Javascript
js Dialog 去掉右上角的X关闭功能
2014/04/23 Javascript
Js操作树节点自动折叠展开的几种方法
2014/05/05 Javascript
jquery实现的简单二级菜单效果代码
2015/09/22 Javascript
gulp-uglify 与gulp.watch()配合使用时报错(重复压缩问题)
2016/08/24 Javascript
JS+CSS3制作炫酷的弹窗效果
2016/11/08 Javascript
gulp加批处理(.bat)实现ng多应用一键自动化构建
2017/02/16 Javascript
20行JS代码实现粘贴板复制功能
2018/02/06 Javascript
微信小程序时间戳转日期的详解
2019/04/30 Javascript
微信小程序 组件的外部样式externalClasses使用详解
2019/09/06 Javascript
[03:22]DAC最前线(第二期)—DOTA2亚洲邀请赛主赛场周边及线路探访
2015/01/24 DOTA
python读取html中指定元素生成excle文件示例
2014/04/03 Python
Python中使用 Selenium 实现网页截图实例
2014/07/18 Python
python调用Matplotlib绘制分布点并且添加标签
2018/05/31 Python
python实现求特征选择的信息增益
2018/12/18 Python
Python Django给admin添加Action的方法实例详解
2019/04/29 Python
django多个APP的urls设置方法(views重复问题解决)
2019/07/19 Python
详解在python操作数据库中游标的使用方法
2019/11/12 Python
Python Excel vlookup函数实现过程解析
2020/06/22 Python
python利用google翻译方法实例(翻译字幕文件)
2020/09/21 Python
英国优质家居用品网上品牌:URBANARA
2018/06/01 全球购物
C#笔试题和英文面试题
2013/02/07 面试题
酒店总经理工作职责
2013/12/13 职场文书
星际争霸:毕姥爷vs解冻01
2022/04/01 星际争霸
SQL Server数据库查询出现阻塞之性能调优
2022/04/10 SQL Server