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


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 keycode总结
Feb 04 Javascript
JS去掉第一个字符和最后一个字符的实现代码
Feb 20 Javascript
JS案例分享之金额小写转大写
May 15 Javascript
javascript中几个容易混淆的概念总结
Apr 14 Javascript
JavaScript实现DIV层拖动及动态增加新层的方法
May 12 Javascript
微信小程序 UI与容器组件总结
Feb 21 Javascript
使用grunt合并压缩js和css文件的方法
Mar 02 Javascript
实战node静态文件服务器的示例代码
Mar 08 Javascript
五分钟搞懂Vuex实用知识(小结)
Aug 12 Javascript
基于JS实现简单滑块拼图游戏
Oct 12 Javascript
JS实现横向轮播图(中级版)
Jan 18 Javascript
前端vue如何使用高德地图
Nov 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
Windows7下PHP开发环境安装配置图文方法
2010/05/20 PHP
thinkphp实现上一篇与下一篇的方法
2014/12/08 PHP
phpinfo() 中 Local Value(局部变量)Master Value(主变量) 的区别
2016/02/03 PHP
利用PHP生成静态html页面的原理
2016/09/30 PHP
laravel通过a标签从视图向控制器实现传值
2019/10/15 PHP
jQuery 入门讲解1
2009/04/15 Javascript
JQuery在光标位置插入内容的实现代码
2010/06/18 Javascript
Javascript访问器属性实例分析
2014/12/30 Javascript
jquery轮播的实现方式 附完整实例
2016/07/28 Javascript
js格式化时间的简单实例
2016/11/27 Javascript
JS焦点图,JS 多个页面放多个焦点图的实例
2016/12/08 Javascript
Vuejs 单文件组件实例详解
2018/02/09 Javascript
JavaScript笛卡尔积超简单实现算法示例
2018/07/30 Javascript
javascript设计模式 ? 中介者模式原理与用法实例分析
2020/04/20 Javascript
[04:44]DOTA2英雄梦之声_第12期_矮人直升机
2014/06/21 DOTA
pyside写ui界面入门示例
2014/01/22 Python
Python 常用的安装Module方式汇总
2017/05/06 Python
解决Python 爬虫URL中存在中文或特殊符号无法请求的问题
2018/05/11 Python
python 通过手机号识别出对应的微信性别(实例代码)
2019/12/22 Python
浅谈keras的深度模型训练过程及结果记录方式
2020/01/24 Python
Python使用Selenium模拟浏览器自动操作功能
2020/09/08 Python
python Paramiko使用示例
2020/09/21 Python
html5 浏览器支持 如何让所有的浏览器都支持HTML5标签样式
2012/12/07 HTML / CSS
iPhoneX安全区域(Safe Area)底部小黑条在微信小程序和H5的屏幕适配
2020/04/08 HTML / CSS
美国受欢迎的眼影品牌:BH Cosmetics
2016/10/25 全球购物
波兰品牌内衣及泳装网上商店:Astratex.pl
2017/02/03 全球购物
Booking.com德国:预订最好的酒店和住宿
2020/02/16 全球购物
Timberland俄罗斯官方网上商店:全球领先的户外品牌
2020/03/15 全球购物
管理部部长岗位职责
2013/12/05 职场文书
公务员职业生涯规划书范文  
2014/01/19 职场文书
尽职尽责村干部自我鉴定
2014/01/23 职场文书
浪漫婚礼主题活动策划方案
2014/09/15 职场文书
2014年企业党支部工作总结
2014/12/04 职场文书
开除员工通知
2015/04/22 职场文书
春风化雨观后感
2015/06/11 职场文书
OpenCV-Python实现轮廓拟合
2021/06/08 Python