您的位置：首页 > 其它

ACE框架整合记录5tooltip插件-【完结】

2016-05-16 15:26 447 查看
效果图



使用

$("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);


内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航