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


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 相关文章推荐
javascript 隔行换色函数代码
Oct 24 Javascript
js 调用百度地图api并在地图上进行打点添加标注
May 13 Javascript
jQuery实现仿百度帖吧头部固定导航效果
Aug 07 Javascript
Bootstrap布局组件应用实例讲解
Feb 17 Javascript
基于BootStrap环境写jQuery tabs插件
Jul 12 Javascript
详解Javascript百度地图接口开发文档中的类和方法
Feb 07 Javascript
详解操作虚拟dom模拟react视图渲染
Jul 25 Javascript
js操作table中tr的顺序实现上移下移一行的效果
Nov 22 Javascript
vue自定义表单生成器form-create使用详解
Jul 19 Javascript
vue proxy 的优势与使用场景实现
Jun 15 Javascript
JS中一些高效的魔法运算符总结
May 06 Javascript
pnpm对npm及yarn降维打击详解
Aug 05 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获取网络文件的实现代码
2010/01/01 PHP
PHP生成指定长度随机数最简洁的方法
2014/07/14 PHP
PHP iconv()函数字符编码转换的问题讲解
2019/03/22 PHP
PHP下载大文件失败并限制下载速度的实例代码
2019/05/10 PHP
javascript eval和JSON之间的联系
2009/12/31 Javascript
JS获取select-option-text_value的方法
2013/12/26 Javascript
JavaScript删除指定子元素代码实例
2015/01/13 Javascript
ECMAScript6中Map/WeakMap详解
2015/06/12 Javascript
JavaScript中ES6 Babel正确安装过程
2016/07/18 Javascript
JS经典正则表达式笔试题汇总
2016/12/15 Javascript
javascript 面向对象function详解及实例代码
2017/02/28 Javascript
详解vue-cli + webpack 多页面实例应用
2017/04/25 Javascript
webpack学习教程之publicPath路径问题详解
2017/06/17 Javascript
详解webpack性能优化——DLL
2017/10/20 Javascript
vue.js项目中实用的小技巧汇总
2017/11/29 Javascript
js 两数组去除重复数值的实例
2017/12/06 Javascript
JS中min函数实例讲解
2019/02/18 Javascript
bootstrap 日期控件 datepicker被弹出框dialog覆盖的解决办法
2019/07/09 Javascript
让IDE识别webpack的别名alias的实现方法
2020/05/06 Javascript
在vue中使用防抖函数组件操作
2020/07/26 Javascript
解读Django框架中的低层次缓存API
2015/07/24 Python
Python3使用requests发闪存的方法
2016/05/11 Python
python中的迭代和可迭代对象代码示例
2017/12/27 Python
Linux下python制作名片示例
2018/07/20 Python
利用python循环创建多个文件的方法
2018/10/25 Python
使用Python-OpenCV向图片添加噪声的实现(高斯噪声、椒盐噪声)
2019/05/28 Python
10款最佳Python开发工具推荐,每一款都是神器
2020/10/15 Python
全球性的女装店:storets
2019/06/12 全球购物
英国最大的在线亚洲杂货店:Red Rickshaw
2020/03/22 全球购物
什么是lambda函数
2013/09/17 面试题
法学毕业生自我鉴定
2014/01/31 职场文书
工程承包协议书
2014/04/22 职场文书
党员个人对照检查材料思想汇报
2014/09/16 职场文书
授权委托书(公民个人适用)
2014/09/19 职场文书
2017元旦、春节期间廉洁自律承诺书
2016/03/25 职场文书
MySQL的prepare使用以及遇到的bug
2022/05/11 MySQL