移动端 一个简单易懂的弹出框


Posted in Javascript onJuly 06, 2016

先给大家展示下效果图,如果大家感觉还不错,请继续参考实现代码。

移动端 一个简单易懂的弹出框

关键代码如下所示:

function tishi(content,url) {
var html = '<div class="xiaoxi none" id="msg" style="z-index:9999;left: 5%;width: 90%;position: fixed;background:none;top:50%;"> <p class="msg" style="background: none repeat scroll 0 0 #000; border-radius: 30px;color: #fff; margin: 0 auto;padding: 1.5em;text-align: center;width: 70%;opacity: 0.8;"></p></div>';
$(document.body).append(html); 
$("#msg").show();
$(".msg").html(content);
if(url){
window.setTimeout("location.href='"+url+"'", 1500);
}else{
setTimeout('$("#msg").fadeOut()', 1500);
}
} 
tishi('留言成功');

以上所述是小编给大家介绍的移动端 一个简单易懂的弹出框 ,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
一个页面元素appendchild追加到另一个页面元素的问题
Jan 27 Javascript
基于jquery编写的横向自适应幻灯片切换特效的实例代码
Aug 06 Javascript
在ASP.NET中使用JavaScript脚本的方法
Nov 12 Javascript
两个select多选模式的选项相互移动(示例代码)
Jan 11 Javascript
sogou地图API用法实例教程
Sep 11 Javascript
深入剖析JavaScript编程中的对象概念
Oct 21 Javascript
返回函数的JavaScript函数
Jun 14 Javascript
微信公众号支付H5调用支付解析
Nov 04 Javascript
js canvas仿支付宝芝麻信用分仪表盘
Nov 16 Javascript
详解React项目的服务端渲染改造(koa2+webpack3.11)
Mar 19 Javascript
node解析修改nginx配置文件操作实例分析
Nov 06 Javascript
JavaScript中跨域问题的深入理解
Mar 04 Javascript
Bootstrap选项卡与Masonry插件的完美结合
Jul 06 #Javascript
针对BootStrap中tabs控件的美化和完善(推荐)
Jul 06 #Javascript
jQuery插件dataTables添加序号列的方法
Jul 06 #Javascript
Spring MVC中Ajax实现二级联动的简单实例
Jul 06 #Javascript
js中window.open的参数及注意注意事项
Jul 06 #Javascript
快速解决js动态改变dom元素属性后页面及时渲染的问题
Jul 06 #Javascript
jQuery 3.0十大新特性
Jul 06 #Javascript
You might like
php用户注册信息验证正则表达式
2015/11/12 PHP
学习php设计模式 php实现享元模式(flyweight)
2015/12/07 PHP
Yii2实现多域名跨域同步登录退出
2017/02/04 PHP
PHP addcslashes()函数讲解
2019/02/03 PHP
nodejs分页类代码分享
2014/06/17 NodeJs
测试IE浏览器对JavaScript的AngularJS的兼容性
2015/06/19 Javascript
jQuery解决input元素的blur事件和其他非表单元素的click事件冲突问题
2016/08/15 Javascript
Jquery组件easyUi实现选项卡切换示例
2016/08/23 Javascript
vue2.0中vue-cli实现全选、单选计算总价格的实例代码
2017/07/18 Javascript
关于前后端json数据的发送与接收详解
2017/07/30 Javascript
js处理包含中文的字符串实例
2017/10/11 Javascript
three.js实现3D视野缩放效果
2017/11/16 Javascript
微信小程序利用canvas 绘制幸运大转盘功能
2018/07/06 Javascript
JavaScript之Blob对象类型的具体使用方法
2019/11/29 Javascript
使用JS实现动态时钟
2020/03/12 Javascript
Openlayers显示瓦片网格信息的方法
2020/09/28 Javascript
Javascript实现打鼓效果
2021/01/29 Javascript
[02:11]完美世界DOTA2联赛10月28日赛事精彩集锦:来吧展示实力强劲
2020/10/29 DOTA
[00:34]拔城逐梦,热血永恒!2020(秋)完美世界城市挑战赛报名开启
2020/10/09 DOTA
Python实现对excel文件列表值进行统计的方法
2015/07/25 Python
python实现文本文件合并
2015/12/29 Python
Python多维/嵌套字典数据无限遍历的实现
2016/11/04 Python
Django使用详解:ORM 的反向查找(related_name)
2018/05/30 Python
Django中的Model操作表的实现
2018/07/24 Python
Python之使用adb shell命令启动应用的方法详解
2019/01/07 Python
梅尔频率倒谱系数(mfcc)及Python实现
2019/06/18 Python
python实现简单的五子棋游戏
2020/09/01 Python
利用CSS3参考手册和CSS3代码生成工具加速来学习网页制
2012/07/11 HTML / CSS
Traffic People官网:女式花裙、上衣和连身裤
2020/10/12 全球购物
公司募捐倡议书
2014/05/14 职场文书
活动总结范文
2014/08/30 职场文书
2015年招商引资工作总结
2015/04/25 职场文书
怎样写工作总结啊!
2019/06/18 职场文书
2019财务毕业实习报告
2019/06/27 职场文书
MongoDB balancer的使用详解
2021/04/30 MongoDB
CDPR谈《巫师》新作用虚幻5原因 称不会为Epic独占
2022/04/06 其他游戏