jquery提示效果实例分析


Posted in Javascript onNovember 25, 2014

本文实例讲述了jquery提示效果的用法。分享给大家供大家参考。具体实现方法如下:

<p><a href="#" class="tooltip" title="这是我的超链接提示1.">提示1.</a></p>

<p><a href="#" class="tooltip" title="这是我的超链接提示2.">提示2.</a></p>

<p><a href="#" title="这是自带提示1.">自带提示1.</a></p>

<p><a href="#" title="这是自带提示2.">自带提示2.</a></p>
$(function(){

    $(".tooltip").mouseenter(function(e){

 this.mytitle=this.title

 this.title=""

 var a="<div>"+this.mytitle+"</div>"

 $("body").append(a);

 $("div").css({

     "top": (e.pageY + y) + "px",

     "left": (e.pageX  + x) + "px"

 }).show("fast")

    }).mouseout(function(){

 this.title= this.mytitle;

 $("div").remove();

     });

})

心得体会:

不要在p标签下追加div元素,会出现一个大的偏差值!

原来!this和$("this")是有所不同,如果上文this.title改写成$("this").attr("title")会导致下面的mouseout事件无法访问保存下来的title。

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

Javascript 相关文章推荐
javascript 火狐(firefox)不显示本地图片问题解决
Jul 05 Javascript
javascript 触发HTML元素绑定的函数
Sep 11 Javascript
当自定义数据属性为json格式字符串时jQuery的data api问题探讨
Feb 18 Javascript
jQuery控制TR显示隐藏的三种常用方法
Aug 21 Javascript
IOS中safari下的select下拉菜单文字过长不换行的解决方法
Sep 26 Javascript
Bootstrap进度条学习使用
Feb 09 Javascript
angularjs的select使用及默认选中设置
Apr 08 Javascript
Angular5中调用第三方库及jQuery的添加的方法
Jun 07 jQuery
ES6 class的应用实例分析
Jun 27 Javascript
layui问题之自动滚动二级iframe页面到指定位置的方法
Sep 18 Javascript
如何在微信小程序中存setStorage
Dec 13 Javascript
element el-tree组件的动态加载、新增、更新节点的实现
Feb 27 Javascript
jQuery操作cookie方法实例教程
Nov 25 #Javascript
JavaScript常用验证函数实例汇总
Nov 25 #Javascript
JavaScript导出Excel实例详解
Nov 25 #Javascript
JS倒计时代码汇总
Nov 25 #Javascript
jquery中push()的用法(数组添加元素)
Nov 25 #Javascript
Jquery焦点图实例代码
Nov 25 #Javascript
jQuery事件绑定和委托实例
Nov 25 #Javascript
You might like
PHP和XSS跨站攻击的防范
2007/04/17 PHP
深入解析Session是否必须依赖Cookie
2013/08/02 PHP
Codeigniter整合Tank Auth权限类库详解
2014/06/12 PHP
20个2014年最优秀的PHP框架回顾
2014/10/22 PHP
crontab无法执行php的解决方法
2016/01/25 PHP
php中各种定义变量的方法小结
2017/10/18 PHP
greybox——不开新窗口看新的网页
2007/02/20 Javascript
js AspxButton的客户端操作
2009/06/26 Javascript
JS字符串截取函数实例
2013/12/27 Javascript
简单的代码实现jquery定时器
2014/01/03 Javascript
用jQuery toggleClass 实现鼠标移上变色
2014/05/14 Javascript
JavaScript中获取时间的函数集
2016/08/16 Javascript
jQuery extend()详解及简单实例
2017/05/06 jQuery
深入理解vue.js中的v-if和v-show
2017/06/22 Javascript
使用MUI框架模拟手机端的下拉刷新和上拉加载功能
2017/09/04 Javascript
vue移动UI框架滑动加载数据的方法
2018/03/12 Javascript
Nuxt升级2.0.0时出现的问题(小结)
2018/10/08 Javascript
QRCode.js二维码生成并能长按识别
2018/10/16 Javascript
小程序接入腾讯位置服务的详细流程
2020/03/03 Javascript
[01:32]DOTA2次级联赛——首支职业女子战队选拔赛全记录
2014/10/23 DOTA
centos 下面安装python2.7 +pip +mysqld
2014/11/18 Python
Python中关于字符串对象的一些基础知识
2015/04/08 Python
python 线程的暂停, 恢复, 退出详解及实例
2016/12/06 Python
python 读取目录下csv文件并绘制曲线v111的方法
2018/07/06 Python
对Python的多进程锁的使用方法详解
2019/02/18 Python
Python如何实现自带HTTP文件传输服务
2020/07/08 Python
python如何提升爬虫效率
2020/09/27 Python
css3使网页、图片变成灰色兼容大多数浏览器
2014/07/02 HTML / CSS
5分钟实现Canvas鼠标跟随动画背景
2019/11/18 HTML / CSS
国际领先的学术出版商:Springer
2017/01/11 全球购物
自我评价怎么写好呢?
2013/12/05 职场文书
环保倡议书300字
2014/05/15 职场文书
学习考察心得体会
2014/09/04 职场文书
大三学生英语考试作弊检讨书
2015/01/01 职场文书
详解Django的MVT设计模式
2021/04/29 Python
MySQL创建管理HASH分区
2022/04/13 MySQL