轻量级jQuery工具提示插件tooltipsy使用方法
今天想给单位的系统弄一个提示插件,懒得自己做,于是就上网百度了几个jQuery插件,挺好用的。下面以tooltipsy插件为例,说明如何使用这些插件。
一、下载
首先到tooltipsy的官网http://tooltipsy.com/下载插件tooltipsy.min.js。貌似官网下载有问题,我是从CSDN下载下来的。
二、安装
在页面引入以下javaScript代码:
<script type="text/javascript" src="/path/to/tooltipsy.min.js"></script>
当然,具体路径需要根据实际情况修改。
三、编写样式表
在页面引入以下样式表代码:
<STYLE type="text/css">
.tooltipsy {
padding: 10px;
max-width: 200px;
color: #303030;
background-color: #f5f5b5;
border: 1px solid #deca7e;
}
</STYLE>
当然这仅仅是最简单的配置,如果有特殊需求,可以查阅官方文档进行相关修改。
四、使用
在HTML部门中的元素,只要在元素属性中加入如下内容就可以使用了,例如:
<div>
<a class="hastip" title="看到提示了吧" >来摸我</a>
</div>
将需要产生tip效果的元素的class属性设置为hastip,title属性设置为需要显示的语句。
在页面中的显示如下:

只要把鼠标移动到相关代码部分,就会弹出提示框。
其他的插件使用方法大同小异
更多的提示插件请看http://www.5icool.org/a/201209/710.html
轻量级jQuery工具提示插件tooltipsy使用方法的更多相关文章
- lightslider-支持移动触摸的轻量级jQuery幻灯片插件
插件简介 lightslider是一款轻量级的响应式jQuery幻灯片插件.lightslider幻灯片插件能够支持移动触摸设备,它可以制作为带缩略图的内容幻灯片,或者制作为无限循环的旋转木马.它的特 ...
- [JQuery插件系列]-强烈推荐10个非常不错的jQuery工具提示插件
个非常酷的 jQuery 工具提示(Tooltip)插件,希望大家能喜欢. 1. Pop! 使用 Pop!可以创建简单的下拉菜单!这是一个并不引人注目的 jQuery 插件. 2. BetterTip ...
- jQuery 分页插件 jqPagination的使用
jqPagination 是一个简单易用的轻量级 jQuery分页插件,其使用了 HTML5 和 CSS3 技术来实现.此插件提供了几个参数设置选项,通过简单的配置即可生成分页控件.此外,它的外观样式 ...
- 顶级jQuery树插件
顶级jQuery树插件 顶级jQuery树插件 2013-03-05 17:20 139人阅读 评论(0) 收藏 举报 jsTree JsTree是一个基于jQuery的Tree控件.支持HTML.J ...
- 20个jQuery分页插件和教程
1.客户端的jQuery 分页插件jPages jPages 是一个客户端的分页插件,但提供很多特性例如自动翻页.键盘和滚动浏览,延迟显示以及完全可定制的导航面板. Read More Demo 2. ...
- 轻量级jQuery语法高亮代码高亮插件jQuery Litelighter。
<!DOCTYPE html><html><head><meta charset="UTF-8" /><title>jQ ...
- jquery轻量级数字动画插件jquery.countup.js
插件描述: jquery.countup.js 是一款轻量级jquery数字动画插件.该数字动画插件可以在页面滚动时,将指定的数字从0开始计数增加动画. 插件说明 jquery.countup.js ...
- jQuery国际化插件 jQuery.i18n.properties 【轻量级】
jQuery.i18n.properties是一款轻量级的jQuery国际化插件,能实现Web前端的国际化. 国际化英文单词为:Internationalization,又称i18n,“i”为单词的第 ...
- jquery编写插件的方法
版权声明:作者原创,转载请注明出处! 编写插件的两种方式: 1.类级别开发插件(1%) 2.对象级别开发(99%) 类级别的静态开发就是给jquery添加静态方法,三种方式 1.添加新的全局函数 2 ...
随机推荐
- DbContext的命名空间
未能找到类型或命名空间名称“DbContext” 解决办法:需要引用命名空间,using System.Data.Entity; 如果还报错的话,则项目需要引用程序集EntityFramework.d ...
- Swift —构造函数与存储属性初始化-备
构造函数的主要作用是初始化实例,其中包括:初始化存储属性和其它的初始化.在Rectangle类或结构体中,如果在构造函数中初始化存储属性width和height后,那么在定义他们时就不需要初始化了. ...
- 09 - 删除vtkDataObject中的ShouldIReleaseData() and ReleaseDataFlag 方法 VTK 6.0 迁移
VTK6 引入了许多不兼容的变.其中之一是删除vtkDataObject中所有有关管道的方法.下面列出来的就是其中的一些方法: ShouldIReleaseData() SetReleaseDataF ...
- SparkStreaming 源码分析
SparkStreaming 分析 (基于1.5版本源码) SparkStreaming 介绍 SparkStreaming是一个流式批处理框架,它的核心执行引擎是Spark,适合处理实时数据与历史数 ...
- window.onscroll
http://www.w3help.org/zh-cn/causes/SD9013 1.各浏览器对 document.document.body.document.documentElement 对象 ...
- 交叉编译环境以及开发板上-/bin/sh: ./hello: not found(使用arm-linux-gcc -static -o 来进行静态编译)
目标板是S3C2440.至于交叉编译环境的搭建就不多说了,网上很多教程. 搭建好了交叉编译环境后,第一件事就是传说中的”Hello,World!”. 一. 主机编译环节 我使用的系统是ubuntu10 ...
- C++调用DLL有两种方法——静态调用和动态调用
C++调用DLL有两种方法——静态调用和动态调用 标签: dllc++winapinullc 2011-09-09 09:49 11609人阅读 评论(0) 收藏 举报 分类: cpp(30) [ ...
- 【HDOJ】2722 Here We Go(relians) Again
根据矩阵建图,然后求最短路径. #include <cstdio> #include <cstring> #include <cstdlib> #define L ...
- Android 调用图库选择图片实现和参数详解
//选择图片,调用图库 bt4.setOnClickListener(new OnClickListener() { @Override public void o ...
- (转)利用ant在Mac 下自动化打包签名Android程序
1.创建一个android项目 参数说明:-k /--package 为命名空间(包名)-a /--name 工程名-p /--path 项目 -t 为目标平台的版本编号 命令:./android c ...