js公共弹出窗插件
/*错误提示框*/
var wr = function() {
var wrap = '<div class="wrapBox opacity"> </div>';
var callback;
var me = this;
var htmlBox = '<div class="alertBox opacity"></div>';
// 遮罩显示
me.faIn = function faIn(callback) {
$('body').append(wrap);
$(wrap).fadeIn(150, function() {
$('.bodyBox').addClass('overAuto');
if (callback) {
callback();
}
;
});
};
// 遮罩隐藏
me.faOut = function(callback) {
$('.wrapBox').fadeOut(150, function() {
$('.bodyBox').removeClass('overAuto');
if (callback) {
callback();
}
;
$(this).remove();
});
};
// 公共提示框
me.alert = function(message, callback) {
if(message){
var pHtml = '<p>' + message + '</p>';
var inhtml = $(htmlBox).append(pHtml);
$('body').append(inhtml);
$(inhtml).fadeIn(250, function() {
setTimeout(function() {
$(inhtml).fadeOut(150, function() {
$(this).html('');
$(this).remove();
});
if (callback) {
callback();
}
}, 2000);
});
} }; me.alertHide=function(){
$('body').find('.alertBox').fadeOut(0,function(){
$(this).html('');
$(this).remove();
});
}; // 电话
me.tel = function(tel, callback) {
var tel = '<p class="telBox"><a href="tel:' + tel + '">' + tel
+ '</a></p>';
if (callback) {
callback();
}
$('body').append(htmlBox);
$('body').append(tel);
$(htmlBox).fadeIn(250);
$('.alertBox').click(function() {
$('.telBox').fadeOut(150, function() {
$(this).remove();
});
$(this).fadeOut(0, function() {
$(this).html('');
$(this).remove(); });
});
};
};
var wrap = new wr();
js公共弹出窗插件的更多相关文章
- 简洁的Jquery弹出窗插件
做项目时,很多时候都需要弹窗提示.如果要求不是很严格的项目,直接使用alert就可以搞定.对于需要高度定制化的项目,而且要求比较高的时候,就需要设计符合整体风格的弹出层,这种有美工帮忙,也比较好搞定. ...
- js登录弹出框插件
第一步:页面引入css:<link rel="stylesheet" type="text/css"" href="common/cs ...
- 推荐一款适合Dynamics 365/Dynamics CRM 2016 使用的弹出窗插件AlertJs
Github地址: https://github.com/PaulNieuwelaar/alertjs 目前有两个版本,3.0版本(30天免费试用)以及2.1版本(完全免费) ------------ ...
- 纯js文件弹出窗写法
<dialog id="myDialog"> 01234567890 <a href="javascript:;" id="clos ...
- 在Vue中使用layer.js弹出层插件
layer.js(mobile)是一个小巧方便的弹出层插件,在之前的apicloud项目中被大量使用,但最近对apicloud的IDE.非常不友好的文档和极低的开发效率深感厌烦,决定弃用然后转向Vue ...
- Jquery和Javascript 实际项目中写法基础-弹出窗和弹出层 (4)
一.实际项目中有很多如下界面效果. 二.该效果可以归结为弹出窗或者弹出层来实现的,为什么这么说?看如下代码: <!DOCTYPE html> <html> & ...
- bootstrap-data-target触发模态弹出窗元素的data使用 data-toggle与data-target的作用 深入ASP.NET MVC之九:Ajax支持 Asp.Net MVC4系列--进阶篇之AJAX
bootstrap-data-target触发模态弹出窗元素的data使用 时间:2017-05-27 14:22:34 阅读:4479 评论:0 收藏:0 [ ...
- Bootstrap模态弹出窗
Bootstrap模态弹出窗有三种方式: 1.href触发模态弹出窗元素: <a class="btn btn-primary" data-toggle="moda ...
- jQuery弹出层插件popbox
都什么年代了,还自己写弹出层插件!是的,①自己写的自己好控制②可定制性高③兼容低版本IE 本插件有以下特性: 样式分离,可定制,纯净无图片 可自定义按钮及按钮的样式.点击事件 可指定选择器选择页面元素 ...
随机推荐
- SNP在世界地图上的频率分布
简单介绍两个网页工具,第一个是GGV,其界面如下: 第二个工具是HGDP,个人感觉画出来有点丑..都是同一所大学开发出来的:界面如下:
- POJ 1971 Parallelogram Counting (Hash)
Parallelogram Counting Time Limit: 5000MS Memory Limit: 65536K Total Submissions: 6895 Acc ...
- 字节输出流 FileOutputStream
输入和输出 : 参照物 都是java程序来参照 output 内存---->硬盘 input 持久化数据-->内存 字节流输出 定义:流按照方向可以分为输入和输出流 字节流 :可以操作任何 ...
- aggregate聚合
最近使用mongodb需要查询数据,用到了aggregate,学习下,上代码 db.表名.aggregate([ {$match:{'created_time':{$gte:'2016-01-15', ...
- Oracle提权
1.创建JAVA包 select dbms_xmlquery.newcontext('declare PRAGMA AUTONOMOUS_TRANSACTION;begin execute immed ...
- 2017-12-15python全栈9期第二天第三节之使用while循环输出0到10不包含7
#!/user/bin/python# -*- coding:utf-8 -*-count = 0while count < 10: count += 1 if count == 7 : con ...
- STM32学习笔记:【003】GPIO
版本:STM32F429 Hal库v1.10 在STM32中,最常用到的功能莫过于GPIO(General Purpose Input Output .通用输入/输出)了,在STM32中,除了除去AD ...
- HTML5 离线缓存Appcache
创建一个和html同名的manifest文件,比如页面为index.html,那么可以建一个index.manifest的文件,然后给index.html的html标签添加如下属性即可: <ht ...
- mysql使用navicat和mysqldump导出数据
1.navicat 方式一:选中表,右键转储:(含有表结构和数据) 方式二:选择右上角工具,点击数据传输,在这个页面右侧选择数据库,左侧选择文件. 点击下一步,选择导出的表名和各种函数什么的,然后点击 ...
- DirectX11 With Windows SDK--04 使用DirectX Tool Kit帮助开发
前言(2018/11/4) DXTK库现在已经不随Github项目提供,因为只用到了其中的键鼠类,已经过提取加入到后续的项目中 但是如果你需要配置DirectXTK到自己的项目当中,可以参考这篇博客进 ...