基于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检测对象中是否存在某个属性判断方法小结
May 19 Javascript
使用jquery的ajax需要注意的地方dataType的设置
Aug 12 Javascript
js实现的黑背景灰色二级导航菜单效果代码
Aug 24 Javascript
JavaScript中Object.prototype.toString方法的原理
Feb 24 Javascript
Node.js五大应用性能技巧小结(必须收藏)
Aug 09 Javascript
js动态引入的四种方法
May 05 Javascript
15个顶级开源JavaScript框架和库
Oct 10 Javascript
vue 中基于html5 drag drap的拖放效果案例分析
Nov 01 Javascript
ES6的Fetch异步请求的实现方法
Dec 07 Javascript
解决前后端分离 vue+springboot 跨域 session+cookie失效问题
May 13 Javascript
JavaScript 变量,数据类型基础实例详解【变量、字符串、数组、对象等】
Jan 04 Javascript
利用uni-app生成微信小程序的踩坑记录
Apr 05 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调用接口用post方法传送json数据的实例
2018/05/31 PHP
php 后端实现JWT认证方法示例
2018/09/04 PHP
Git命令之分支详解
2021/03/02 PHP
jQuery选择没有colspan属性的td的代码
2010/07/06 Javascript
Jquery原生态实现表格header头随滚动条滚动而滚动
2014/03/18 Javascript
confirm的用法示例用于按钮操作时确定是否执行
2014/06/19 Javascript
JS实现黑色风格的网页TAB选项卡效果代码
2015/10/09 Javascript
javascript给span标签赋值的方法
2015/11/26 Javascript
Easyui 之 Treegrid 笔记
2016/04/29 Javascript
Listloading.js移动端上拉下拉刷新组件
2016/08/04 Javascript
利用CSS、JavaScript及Ajax实现图片预加载的三大方法
2017/01/22 Javascript
bootstrapValidator 重新启用提交按钮的方法
2017/02/20 Javascript
详解在Vue中有条件地使用CSS类
2017/09/30 Javascript
node.js多个异步过程中判断执行是否完成的解决方案
2017/12/10 Javascript
通过jquery获取上传文件名称、类型和大小的实现代码
2018/04/19 jQuery
jquery.param()实现数组或对象的序列化方法
2018/10/08 jQuery
package.json各个属性说明详解
2020/03/11 Javascript
pandas 将list切分后存入DataFrame中的实例
2018/07/03 Python
python生成以及打开json、csv和txt文件的实例
2018/11/16 Python
python实现从pdf文件中提取文本,并自动翻译的方法
2018/11/28 Python
利用Python实现微信找房机器人实例教程
2019/03/10 Python
python单向循环链表原理与实现方法示例
2019/12/03 Python
Keras中的多分类损失函数用法categorical_crossentropy
2020/06/11 Python
python3列表删除大量重复元素remove()方法的问题详解
2021/01/04 Python
Coggles美国/加拿大:高级国际时装零售商
2018/10/23 全球购物
全球最大的瓷器、水晶和银器零售商:Replacements
2020/06/15 全球购物
员工拾金不昧表扬信
2014/01/09 职场文书
幼儿园的门卫岗位职责
2014/04/10 职场文书
小学毕业演讲稿
2014/04/25 职场文书
高三毕业评语
2014/12/31 职场文书
幼儿园2015年度工作总结
2015/04/01 职场文书
行政二审代理词
2015/05/25 职场文书
刑事法律意见书
2015/06/04 职场文书
uni-app 微信小程序授权登录的实现步骤
2022/02/18 Javascript
Java由浅入深通关抽象类与接口(下篇)
2022/04/26 Java/Android
centos环境下nginx高可用集群的搭建指南
2022/07/23 Servers