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 相关文章推荐
基于jQuery的淡入淡出可自动切换的幻灯插件打包下载
Sep 15 Javascript
JS中prototype关键字的功能介绍及使用示例
Jul 21 Javascript
vue2.0+webpack环境的构造过程
Nov 08 Javascript
使用JavaScript获取URL中的参数(两种方法)
Nov 16 Javascript
jQGrid Table操作列中点击【操作】按钮弹出按钮层的实现代码
Dec 05 Javascript
Bootstrap模态框(Modal)实现过渡效果
Mar 17 Javascript
原生js编写2048小游戏
Mar 17 Javascript
Bootstrap Tooltip显示换行和左对齐的解决方案
Oct 11 Javascript
关于vue表单提交防双/多击的例子
Oct 31 Javascript
vue简单封装axios插件和接口的统一管理操作示例
Feb 02 Javascript
解决vue中el-tab-pane切换的问题
Jul 19 Javascript
vue 给数组添加新对象并赋值
Apr 20 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
WordPress中用于获取搜索表单的PHP函数使用解析
2016/01/05 PHP
php图形jpgraph操作实例分析
2017/02/22 PHP
tp5 实现列表数据根据状态排序
2019/10/18 PHP
PHP预定义接口――Iterator用法示例
2020/06/05 PHP
用js实现的仿sohu博客更换页面风格(简单版)
2007/03/22 Javascript
javaScript NameSpace 简单说明介绍
2013/07/18 Javascript
jquery统计输入文字的个数并对其进行判断
2014/01/07 Javascript
利用Jquery实现可多选的下拉框
2014/02/21 Javascript
js监听鼠标点击和键盘点击事件并自动跳转页面
2014/09/24 Javascript
jquery中one()方法的用法实例
2015/01/16 Javascript
JavaScript动态修改网页元素内容的方法
2015/03/21 Javascript
Boostrap模态窗口的学习小结
2016/03/28 Javascript
Easyui Treegrid改变默认图标的方法
2016/04/29 Javascript
JavaScript的Backbone.js框架环境搭建及Hellow world示例
2016/05/07 Javascript
js轮播图无缝滚动效果
2017/06/17 Javascript
JS操作时间 - UNIX时间戳的简单介绍(必看篇)
2017/08/16 Javascript
Angular移动端页面input无法输入的解决方法
2017/11/14 Javascript
[04:01]2014DOTA2国际邀请赛 TITAN告别Ohaiyo期望明年再战
2014/07/15 DOTA
[22:20]初生之犊-TI4第5名LGD战队纪录片
2014/08/13 DOTA
wxpython 学习笔记 第一天
2009/03/16 Python
Scrapy的简单使用教程
2017/10/24 Python
ubuntu环境下python虚拟环境的安装过程
2018/01/07 Python
python3 图片referer防盗链的实现方法
2018/03/12 Python
Python学习笔记之读取文件、OS模块、异常处理、with as语法示例
2019/06/04 Python
djano一对一、多对多、分页实例代码
2019/08/16 Python
Python 3.8 新功能来一波(大部分人都不知道)
2020/03/11 Python
详解在Python中使用Torchmoji将文本转换为表情符号
2020/07/27 Python
python+selenium实现12306模拟登录的步骤
2021/01/21 Python
迪斯尼商品官方网站:ShopDisney
2016/08/01 全球购物
奥地利顶级内衣丝袜品牌英国站:Wolford英国
2016/08/29 全球购物
美国滑雪和滑雪板商店:Buckman
2018/03/03 全球购物
竞选班长自荐书范文
2014/03/09 职场文书
实验心得体会
2014/09/05 职场文书
单位推荐信范文
2015/03/27 职场文书
导游词之江苏溱潼古镇
2019/11/27 职场文书
python自然语言处理之字典树知识总结
2021/04/25 Python