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 相关文章推荐
用innerhtml提高页面打开速度的方法
Aug 02 Javascript
jQuery对Select的操作大集合(收藏)
Dec 28 Javascript
JavaScript中常用的六种互动方法示例
Mar 13 Javascript
JQuery控制radio选中和不选中方法总结
Apr 15 Javascript
webpack进阶——缓存与独立打包的用法
Aug 02 Javascript
AngularJS ionic手势事件的使用总结
Aug 09 Javascript
彻底理解js面向对象之继承
Feb 04 Javascript
vue组件开发props验证的实现
Feb 12 Javascript
详解微信小程序的不同函数调用的几种方法
May 08 Javascript
Typescript的三种运行方式(小结)
Sep 18 Javascript
JS面向对象编程基础篇(二) 封装操作实例详解
Mar 03 Javascript
Javascript实现打鼓效果
Jan 29 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.MVC的模板标签系统(五)
2006/09/05 PHP
php 数组动态添加实现代码(最土团购系统的价格排序)
2011/12/30 PHP
php高清晰度无损图片压缩功能的实现代码
2018/12/09 PHP
浅谈Nodejs中的作用域问题
2016/12/26 NodeJs
Vue2 模板template的四种写法总结
2018/02/23 Javascript
React如何解决fetch跨域请求时session失效问题
2018/11/02 Javascript
js字符串倒序的实例代码
2018/11/30 Javascript
新版小程序登录授权的方法
2018/12/12 Javascript
Vue的transition-group与Virtual Dom Diff算法的使用
2019/12/09 Javascript
Python代码解决RenderView窗口not found问题
2016/08/28 Python
Python实现的中国剩余定理算法示例
2017/08/05 Python
利用Python-iGraph如何绘制贴吧/微博的好友关系图详解
2017/11/02 Python
Pandas中把dataframe转成array的方法
2018/04/13 Python
python SMTP实现发送带附件电子邮件
2018/05/22 Python
Python判断是否json是否包含一个key的方法
2018/12/31 Python
Python定时发送天气预报邮件代码实例
2019/09/09 Python
python将时分秒转换成秒的实例
2019/12/07 Python
Python中Flask-RESTful编写API接口(小白入门)
2019/12/11 Python
Pycharm 2020年最新激活码(亲测有效)
2020/09/18 Python
tensorflow:指定gpu 限制使用量百分比,设置最小使用量的实现
2020/02/06 Python
python如何遍历指定路径下所有文件(按按照时间区间检索)
2020/09/14 Python
CSS+jQuery+PHP+MySQL实现的在线答题功能
2015/04/25 HTML / CSS
CSS3条纹背景制作的实战攻略
2016/05/31 HTML / CSS
挪威户外活动服装和装备购物网站:Bergfreunde挪威
2016/10/20 全球购物
澳洲的服装老品牌:SABA
2018/02/06 全球购物
美国婴童服装市场上的领先品牌:Carter’s
2018/02/08 全球购物
德国最大的网上足球商店:11teamsports
2019/09/11 全球购物
遗体告别仪式主持词
2014/03/20 职场文书
微电影大赛策划方案
2014/06/05 职场文书
525心理活动总结
2014/07/04 职场文书
优秀员工自荐书
2015/03/06 职场文书
首都博物馆观后感
2015/06/05 职场文书
单位收入证明范本
2015/06/18 职场文书
tomcat的catalina.out日志按自定义时间格式进行分割的操作方法
2022/04/02 Servers
未发现nvidia显卡怎么办?Win11系统中未检测到nvidia显卡解决教程
2022/04/08 数码科技
css3手动实现pc端横向滚动
2022/06/21 HTML / CSS