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 相关文章推荐
Ajax::prototype 源码解读
Jan 22 Javascript
javascript之可拖动的iframe效果代码
Aug 01 Javascript
再论Javascript下字符串连接的性能
Mar 05 Javascript
js的表单操作 简单计算器
Dec 29 Javascript
js实现页面转发功能示例代码
Aug 05 Javascript
解决jquery1.9不支持browser对象的问题
Nov 13 Javascript
JS数组(Array)处理函数整理
Dec 07 Javascript
详解JavaScript基本类型和引用类型
Dec 09 Javascript
html5+CSS 实现禁止IOS长按复制粘贴功能
Dec 28 Javascript
vue-devtools的安装步骤
Apr 23 Javascript
layui的table中显示图片方法
Aug 17 Javascript
详解如何在Canvas中添加事件的方法
Apr 17 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
DedeCMS dede_channeltype表字段注释
2010/04/07 PHP
php实现模拟登陆方正教务系统抓取课表
2015/05/19 PHP
thinkPHP实现递归循环栏目并按照树形结构无限极输出的方法
2016/05/19 PHP
利用php + Laravel如何实现部署自动化详解
2017/10/11 PHP
php读取本地json文件的实例
2018/03/07 PHP
thinkPHP利用ajax异步上传图片并显示、删除的示例
2018/09/26 PHP
在Javascript中定义对象类别
2006/12/22 Javascript
jQuery News Ticker 基于jQuery的即时新闻行情展示插件
2011/11/05 Javascript
javascript调试过程中找不到哪里出错的可能原因
2013/12/16 Javascript
js同源策略详解
2015/05/21 Javascript
浅析javascript函数表达式
2016/02/10 Javascript
JS字符串的切分用法实例
2016/02/22 Javascript
jQuery文字横向滚动效果的实现代码
2016/05/31 Javascript
JS实现的样式切换功能tableCSS实例
2016/12/30 Javascript
原生Javascript插件开发实践
2017/01/09 Javascript
Vue form 表单提交+ajax异步请求+分页效果
2017/04/22 Javascript
Vue2.0权限树组件实现代码
2017/08/29 Javascript
[03:40]DOTA2亚洲邀请赛小组赛第二日 赛事回顾
2015/01/31 DOTA
[03:27]《辉夜杯》线下训练营 导师CU和海涛指点迷津
2015/10/23 DOTA
[03:39]这就是刀塔,我们是冠军!燃情短片讲述我们的DOTA故事
2019/07/02 DOTA
利用Python中unittest实现简单的单元测试实例详解
2017/01/09 Python
通过源码分析Python中的切片赋值
2017/05/08 Python
如何用Python破解wifi密码过程详解
2019/07/12 Python
Python(PyS60)实现简单语音整点报时
2019/11/18 Python
python元组的概念知识点
2019/11/19 Python
python实现提取str字符串/json中多级目录下的某个值
2020/02/27 Python
Python面向对象多态实现原理及代码实例
2020/09/16 Python
美国专业级皮肤病和spa品质护肤品的高级零售网站:SkinCareRx
2017/02/06 全球购物
高中政治教学反思
2014/01/18 职场文书
市场开发计划书
2014/05/07 职场文书
论文诚信承诺书
2014/05/23 职场文书
应届毕业生求职信范文
2014/07/07 职场文书
2014国庆节演讲稿:祖国在我心中(400字)
2014/09/25 职场文书
大队委员竞选演讲稿
2015/11/20 职场文书
CSS完成视差滚动效果
2021/04/27 HTML / CSS
Java版 简易五子棋小游戏
2022/05/04 Java/Android