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 相关文章推荐
JQuery Dialog的内存泄露问题解决方法
Jun 18 Javascript
使用javascript获取flash加载的百分比的实现代码
May 25 Javascript
动态加载外部javascript文件的函数代码分享
Jul 28 Javascript
jQuery中position()方法用法实例
Jan 16 Javascript
基于zepto.js简单实现上传图片
Jun 21 Javascript
jQuery 利用$.ajax 时获取原生XMLHttpRequest 对象的方法
Aug 25 Javascript
Vuex模块化实现待办事项的状态管理
Mar 15 Javascript
jQuery实现菜单的显示和隐藏功能示例
Jul 24 jQuery
axios取消请求的实践记录分享
Sep 26 Javascript
js实现图片推拉门效果代码实例
May 18 Javascript
改进 JavaScript 和 Rust 的互操作性并深入认识 wasm-bindgen 组件
Jul 13 Javascript
微信小程序select下拉框实现源码
Nov 08 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如何调用webservice应用介绍
2012/11/24 PHP
PHP之正则表达式捕获组与非捕获组(详解)
2015/07/29 PHP
php数据访问之增删改查操作
2016/05/09 PHP
CI框架实现创建自定义类库的方法
2018/12/25 PHP
ASP.NET jQuery 实例6 (实现CheckBoxList成员全选或全取消)
2012/01/13 Javascript
JS将制定内容复制到剪切板示例代码
2014/02/11 Javascript
javascript 实现map集合
2015/04/03 Javascript
如何实现移动端浏览器不显示 pc 端的广告
2015/10/15 Javascript
浅析JavaScriptSerializer类的序列化与反序列化
2016/11/22 Javascript
jQuery DateTimePicker 日期和时间插件示例
2017/01/22 Javascript
简单实现js放大镜效果
2017/07/24 Javascript
JavaScript中使用参数个数实现重载功能
2017/09/01 Javascript
js删除数组中的元素delete和splice的区别详解
2018/02/03 Javascript
node.js开发辅助工具nodemon安装与配置详解
2020/02/06 Javascript
React组件设计模式之组合组件应用实例分析
2020/04/29 Javascript
JavaScript实现答题评分功能页面
2020/06/24 Javascript
[00:47]DOTA2荣耀之路6:玩不了啦!
2018/05/30 DOTA
Python中的exec、eval使用实例
2014/09/23 Python
Python虚拟环境virtualenv的安装与使用详解
2017/05/28 Python
Python实现PS滤镜特效Marble Filter玻璃条纹扭曲效果示例
2018/01/29 Python
python 执行文件时额外参数获取的实例
2018/12/18 Python
Python自定义一个异常类的方法
2019/06/27 Python
python scrapy重复执行实现代码详解
2019/12/28 Python
Pytorch之parameters的使用
2019/12/31 Python
使用Pyhton 分析酒店针孔摄像头
2020/03/04 Python
python实现udp聊天窗口
2020/03/31 Python
python实现马丁策略的实例详解
2021/01/15 Python
Python 中如何使用 virtualenv 管理虚拟环境
2021/01/21 Python
优秀教师获奖感言
2014/01/31 职场文书
女娲补天教学反思
2014/02/05 职场文书
幼儿评语大全
2014/04/30 职场文书
揭牌仪式策划方案
2014/05/28 职场文书
党员干部廉洁自律承诺书
2015/04/28 职场文书
军训阅兵新闻稿
2015/07/17 职场文书
用Python selenium实现淘宝抢单机器人
2021/06/18 Python
浅谈如何保证Mysql主从一致
2022/03/13 MySQL