ACE框架整合记录5tooltip插件-【完结】
来源:互联网 发布:java图形接口 编辑:程序博客网 时间:2024/06/07 05:05
效果图
使用
$("body").acetooltip({
content: result, callback: function () {
window.location.href = window.location.href;
}
});
插件代码
/**
*说明:与ace配套的在主页面使用的ToolTip插件
*作者:黄枰凯
*更新时间:2016-5-11 15:29 完结
*/
(function ($, window) {
$.fn.acetooltip = function (options) {
// 默认参数
var defaults = {
content: "",
width: "200px",
height: "40px",
callback: null
};
var _self = $(this);
// 插件配置
var opt = $.extend(defaults, options);
var div = $("<div class=\"widget-container-span modal fade in\" style=\"width:" + opt.width + ";height:"+opt.height+"; padding:10px; background-color:white; opacity:0.7; overflow:hidden; margin: 120px auto;border:1px solid #ddd;\"> <i class=\"icon-volume-up bigger-130 green\"></i>"+opt.content+"</div>");
_self.append(div)
//动画显示
div.animate({
height: 'toggle'
}, function () {
setTimeout(function () {
//关闭
div.animate({
height: 'toggle'
}, function () {
div.remove();
if ($.isFunction(opt.callback)) {
//返回button对象
opt.callback.apply(this);
}
});
}, 1200);
});
return this;
}
})(jQuery, window);
$("body").acetooltip({
content: result, callback: function () {
window.location.href = window.location.href;
}
});
插件代码
/**
*说明:与ace配套的在主页面使用的ToolTip插件
*作者:黄枰凯
*更新时间:2016-5-11 15:29 完结
*/
(function ($, window) {
$.fn.acetooltip = function (options) {
// 默认参数
var defaults = {
content: "",
width: "200px",
height: "40px",
callback: null
};
var _self = $(this);
// 插件配置
var opt = $.extend(defaults, options);
var div = $("<div class=\"widget-container-span modal fade in\" style=\"width:" + opt.width + ";height:"+opt.height+"; padding:10px; background-color:white; opacity:0.7; overflow:hidden; margin: 120px auto;border:1px solid #ddd;\"> <i class=\"icon-volume-up bigger-130 green\"></i>"+opt.content+"</div>");
_self.append(div)
//动画显示
div.animate({
height: 'toggle'
}, function () {
setTimeout(function () {
//关闭
div.animate({
height: 'toggle'
}, function () {
div.remove();
if ($.isFunction(opt.callback)) {
//返回button对象
opt.callback.apply(this);
}
});
}, 1200);
});
return this;
}
})(jQuery, window);
0 0
- ACE框架整合记录5tooltip插件-【完结】
- ACE框架整合记录2Tab插件-【完结】
- ACE框架整合记录4Dialog插件-【完结】
- ACE框架整合记录3Menu插件与Tab插件整合【完结】
- ACE框架整合记录1基础框架【完结】
- ACE框架整合记录6菜单权限列表样式效果
- SpringMVC_Spring_Mybits框架整合记录
- ssm框架整合记录
- ssm 框架整合学习记录
- ace admin java 整合 开发 后台框架,aceadmin_HTML5
- ace admin java 整合 开发 后台框架,aceadmin_HTML5 java springmvc
- ace admin java 整合 开发 后台框架,aceadmin_HTML5 java
- activiti ace admin 整合 开发 后台框架集成 学习Demo
- reactjs+ace+shiro+ssm+jpa的web框架的整合
- activiti 工作流 ace admin 整合 开发 后台框架集成 学习
- ACE框架
- ACE框架
- jquery插件之tooltip
- 神奇的排序
- 阐述一下线程与进程的区别
- 动态规划交错匹配问题
- 网络层概念学习之一(基本概念、路由器、选路算法)
- Arm Inline hook的简易原理图
- ACE框架整合记录5tooltip插件-【完结】
- iOS设备唯一标识探讨
- java设计模式:代理模式
- Winform NetAdvantage的Summary相关功能(一)
- 新闻类list,支持两种不同的item
- cocos2dx3.x 导出自定义事件到lua的方法
- Android-微信支付简单教程
- nohup linux 运行不了
- 排序——归并排序