jQuery 中msgTips 顶部弹窗效果实现代码


Posted in jQuery onAugust 14, 2017

最近发现好多网站都采用顶部弹窗,并且不用用户手动去点击确定。感觉这样很方便用户,所以也找了好多大神的代码,整理一下方便以后查找

前端:

@{
  Layout = null;
}
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
  <title>jQuery网页顶部显示操作提示插件 - 聚合分享 - www.juheweb.com</title>
  <link href="~/top/css/css.css" rel="external nofollow" rel="stylesheet" />
  <script src="~/top/js/jquery-1.8.3.min.js"></script>
  <script src="~/top/js/msgTips.js"></script>
  <script type="text/javascript">
    $(function () {
      $("#ie").manhua_msgTips({
        Event: "click",      //响应的事件
        timeOut: 4000,        //提示层显示的时间
        msg: "为了保证更好的网站体验,请升级IE版本到8.0或以上!",      //显示的消息
        speed: 0,        //滑动速度
        type: "warning"      //提示类型(1、success 2、error 3、warning)
      });
      $("#no").manhua_msgTips({
        Event: "click",      //响应的事件
        timeOut: 3000,        //提示层显示的时间
        msg: "很抱歉!您好操作此插件错误,请重新操作!",  //显示的消息
        speed: 0,        //滑动速度
        type: "error"      //提示类型(1、success 2、error 3、warning)
      });
      $("#yes").manhua_msgTips({
        Event: "click",      //响应的事件
        timeOut: 2000,        //提示层显示的时间
        msg: "恭喜你!操作成功,欢迎访问聚合分享网站",      //显示的消息
        speed: 300,        //滑动速度
        type: "success"      //提示类型(1、success 2、error 3、warning)
      });
    });
  </script>
  <style>
    input {
      padding: 10px 20px;
    }
  </style>
</head>
<body>
  <div style="margin:300px auto; width:350px;">
    <input type="button" id="ie" value="警告提示" />  
    <input type="button" id="no" value="错误提示" />  
    <input type="button" id="yes" value="成功提示" />
  </div>
</body>
</html>

个人感觉还是很好用的,这个是从某位大神那里引用来的,如果有冒犯,麻烦告诉我,我会删除的

总结

以上所述是小编给大家介绍的jQuery 中msgTips 顶部弹窗效果实现代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

jQuery 相关文章推荐
jQuery实现的背景颜色渐变动画效果示例
Mar 24 jQuery
jQuery实现Select下拉列表进行状态选择功能
Mar 30 jQuery
如何选择jQuery版本 1.x? 2.x? 3.x?
Apr 01 jQuery
基于jQuery实现瀑布流页面
Apr 11 jQuery
jQuery插件FusionCharts绘制的2D双柱状图效果示例【附demo源码】
May 13 jQuery
jQuery异步提交表单实例
May 30 jQuery
关于jquery layui弹出层的使用方法
Apr 21 jQuery
jQuery实现为动态添加的元素绑定事件实例分析
Sep 07 jQuery
jquery+php后台实现省市区联动功能示例
May 23 jQuery
jQuery利用cookie 实现本地收藏功能(不重复无需多次命名)
Nov 07 jQuery
jQuery 添加元素和删除元素的方法
Jul 15 jQuery
jQuery冲突问题解决方法
Jan 19 jQuery
jQuery:unbind方法的使用详解
Aug 14 #jQuery
jQuery 实时保存页面动态添加的数据的示例
Aug 14 #jQuery
jQuery Ajax 实现分页 kkpager插件实例代码
Aug 10 #jQuery
jquery.uploadView 实现图片预览上传功能
Aug 10 #jQuery
jquery对table做排序操作的实例演示
Aug 10 #jQuery
详解jQuery同步Ajax带来的UI线程阻塞问题及解决办法
Aug 09 #jQuery
快速掌握jquery分页插件jqPaginator的使用方法
Aug 09 #jQuery
You might like
编译问题
2006/10/09 PHP
动易数据转成dedecms的php程序
2007/04/07 PHP
动态修改DOM 里面的 id 属性的弊端分析
2008/09/03 Javascript
基于jquery实现控制经纬度显示地图与卫星
2013/05/20 Javascript
非常好用的JsonToString 方法 简单实例
2013/07/18 Javascript
javascript Event对象详解及使用示例
2013/11/22 Javascript
实例解析jQuery中proxy()函数的用法
2016/05/24 Javascript
AngularJs Scope详解及示例代码
2016/09/01 Javascript
webpack常用配置项配置文件介绍
2016/11/07 Javascript
NodeJS整合银联网关支付(DEMO)
2016/11/09 NodeJs
jQuery Easyui datagrid行内实现【添加】、【编辑】、【上移】、【下移】
2016/12/19 Javascript
JavaScript跳出循环的三种方法(break, return, continue)
2019/07/30 Javascript
基于Vue sessionStorage实现保留搜索框搜索内容
2020/06/01 Javascript
[51:17]完美世界DOTA2联赛循环赛Inki vs DeMonsTer 第二场 10月30日
2020/10/31 DOTA
Python HTMLParser模块解析html获取url实例
2015/04/08 Python
python修改操作系统时间的方法
2015/05/18 Python
windows 10下安装搭建django1.10.3和Apache2.4的方法
2017/04/05 Python
PyChar学习教程之自定义文件与代码模板详解
2017/07/17 Python
Python实现的弹球小游戏示例
2017/08/01 Python
Python字符串格式化的方法(两种)
2017/09/19 Python
Python设计模式之中介模式简单示例
2018/01/09 Python
1分钟快速生成用于网页内容提取的xslt
2018/02/23 Python
python中copy()与deepcopy()的区别小结
2018/08/03 Python
selenium+python实现自动化登录的方法
2018/09/04 Python
python直接获取API传递回来的参数方法
2018/12/17 Python
python函数中将变量名转换成字符串实例
2020/05/11 Python
python实现MySQL指定表增量同步数据到clickhouse的脚本
2021/02/26 Python
材料化学应届生求职信
2013/10/09 职场文书
英语自荐信常用语句
2013/12/13 职场文书
公司口号大全
2014/06/11 职场文书
房屋质量投诉书
2015/07/02 职场文书
八年级语文教学反思
2016/03/03 职场文书
python四种出行路线规划的实现
2021/06/23 Python
sql注入教程之类型以及提交注入
2021/08/02 MySQL
pytorch分类模型绘制混淆矩阵以及可视化详解
2022/04/07 Python
Elasticsearch6.2服务器升配后的bug(避坑指南)
2022/09/23 Servers