jQuery实现的简单提示信息插件


Posted in Javascript onDecember 08, 2015

本文实例讲述了jQuery实现的简单提示信息插件。分享给大家供大家参考,具体如下:

jQuery代码如下:

(function ($) {
  $.fn.Tips = function (options) {
    var defaults = {
      html: "",
      times: 3000
    }
    _this_ = $("#tips");
    _this_.html(options.html);
    _this_.show();
    setTimeout(function () { _this_.hide() }, options.times);
  };
})(jQuery);

css样式如下:

.tips
{
  height: 20px;
  background-color: Green;
  padding: 5px 20px;
  color: White;
  display: none;
  margin-left: 50px;
}

使用方法:

<span class="tips" style="display:none" id="tips"><span>
<script>
$("#aa").Tips({html:"提示信息的内容",times:4000})
</script>

希望本文所述对大家jQuery程序设计有所帮助。

Javascript 相关文章推荐
javascript 动态添加事件代码
Nov 30 Javascript
js弹出层包含flash 不能关闭隐藏的2种处理方法
Jun 17 Javascript
jquery map方法使用示例
Apr 23 Javascript
jQuery自定义动画函数实例详解(附demo源码)
Dec 10 Javascript
学习Javascript面向对象编程之封装
Feb 23 Javascript
BackBone及其实例探究_动力节点Java学院整理
Jul 14 Javascript
在vue-cli项目中使用bootstrap的方法示例
Apr 21 Javascript
layui复选框的全选与取消实现方法
Sep 02 Javascript
js实现左右轮播图
Jan 09 Javascript
js实现select下拉框选择
Jan 11 Javascript
构建一个JavaScript插件系统
Oct 20 Javascript
基于Vue2实现移动端图片上传、压缩、拖拽排序、拖拽删除功能
Jan 05 Vue.js
JS组件Bootstrap Table表格多行拖拽效果实现代码
Dec 08 #Javascript
AngularJS实现全选反选功能
Dec 08 #Javascript
JS操作XML实例总结(加载与解析XML文件、字符串)
Dec 08 #Javascript
JS组件Bootstrap Table表格行拖拽效果实现代码
Aug 27 #Javascript
JS获取月份最后天数、最大天数与某日周数的方法
Dec 08 #Javascript
AngularJS Module方法详解
Dec 08 #Javascript
JS组件Bootstrap实现弹出框和提示框效果代码
Dec 08 #Javascript
You might like
php Xdebug 调试扩展的安装与使用.
2010/03/13 PHP
PHP命名空间(Namespace)简明教程
2014/06/11 PHP
WordPress中is_singular()函数简介
2015/02/05 PHP
phpmailer绑定邮箱的实现方法
2016/12/01 PHP
Centos7.7 64位利用本地完整安装包安装lnmp/lamp套件教程
2021/03/09 Servers
Jquery给基本控件的取值、赋值示例
2014/05/23 Javascript
node.js中的url.format方法使用说明
2014/12/10 Javascript
js完美解决IE6不支持position:fixed的bug
2015/04/24 Javascript
针对初学者的jQuery入门指南
2015/08/15 Javascript
js提交form表单,并传递参数的实现方法
2016/05/25 Javascript
详解nodeJS之路径PATH模块
2017/05/31 NodeJs
js登录滑动验证的实现(不滑动无法登陆)
2018/01/03 Javascript
jQuery实现动画、消失、显现、渐出、渐入效果示例
2018/09/06 jQuery
webpack4+react多页面架构的实现
2018/10/25 Javascript
countUp.js实现数字滚动效果
2019/10/18 Javascript
vant 时间选择器--开始时间和结束时间实例
2020/11/04 Javascript
pytyon 带有重复的全排列
2013/08/13 Python
Python实现多线程抓取网页功能实例详解
2017/06/08 Python
Pandas读写CSV文件的方法示例
2019/03/27 Python
对python中不同模块(函数、类、变量)的调用详解
2019/07/16 Python
python 错误处理 assert详解
2020/04/20 Python
python使用openpyxl操作excel的方法步骤
2020/05/28 Python
matplotlib.pyplot.matshow 矩阵可视化实例
2020/06/16 Python
python中类与对象之间的关系详解
2020/12/16 Python
pycharm 如何取消连按两下shift出现的全局搜索
2021/01/15 Python
CSS3 transforms应用于背景图像的解决方法
2019/04/16 HTML / CSS
使用HTML和CSS实现的标签云效果(附demo)
2021/02/03 HTML / CSS
最耐用行李箱,一箱永流传:Briggs & Riley(全球终身保修)
2017/12/07 全球购物
客户代表实习人员自我鉴定
2013/09/27 职场文书
打架检讨书400字
2014/01/17 职场文书
小学竞选班干部演讲稿
2014/08/20 职场文书
高中生逃课检讨书
2014/10/10 职场文书
2014流动人口计划生育工作总结
2014/12/20 职场文书
《给予树》教学反思
2016/03/03 职场文书
CSS作用域(样式分割)的使用汇总
2021/11/07 HTML / CSS
Java版 单机五子棋
2022/05/04 Java/Android