关键知识点:

  1、事件对象:当事件一旦被触发,事件对象便会创立。事件对象只能作用于该事件的事件处理程序。

  2、认识了mousemove事件了连续触发执行的特性。

代码:

  HTML:

<div class="box"><a href="javascript:;" class="link" title="超链接的标题,也是要提示的文字">超链接提示效果示例</a></div>

  

  Jquery:

    $('.link').mouseover(function(event){
//event便是事件对象,事件处理函数一旦执行,事件对象便会创立。事件处理函数一旦结束,事件对象便会销毁。
title = this.title;
this.title="";
var tipBox = '<div id="tipContent">'+ title +'</div';
$('body').append(tipBox);
$('#tipContent').css({
'position':'absolute',
'left':event.pageX+5,
'top':event.pageY+5
});
}).mouseout(function(){
$('#tipContent').remove(); //移除提示内容元素
this.title=title; //为链接重新设置title值,为下次指向时使用。
}).mousemove(function(event){
$('#tipContent').css({
'left':event.pageX+5,
'top':event.pageY+5
})
})

[锋利的JQ]-超链接提示效果的更多相关文章

  1. 超链接提示效果jQuery+CSS+html

    我们知道浏览器自带了超链接提示, 只需要在超链接中加入 title 属性就可以了. <a href="#" title="吉大砍人案致1死1伤 受害者死前大喊他手里 ...

  2. Jq超链接提示

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. [锋利JQ]-图片提示效果

    新知识点: 在HTML-Dom中 "style" 属性,是所有HTML标签共有的一个对象属性,这个对象属性可以为元素设置内嵌样式. style是元素的属性,但是它自身则是一个对象, ...

  4. jQuery超链接提示,提示跟随鼠标动

    功能:实现鼠标移动到一个超链接时,鼠标右下角产生一个提示,并跟谁鼠标移动,知道鼠标离开超链接. 效果: 源码: <!--本案例是鼠标放在超链接上时,鼠标旁边有提示这是个超练级,以及放在图片上时图 ...

  5. BootStrap入门教程 (四) :JQuery类库插件(模态窗口,滚动监控,标签效果,提示效果,“泡芙”效果,警告区域,折叠效果,旋转木马,输入提示)

    上讲回顾:Bootstrap组件丰富同时具有良好可扩展性,能够很好地应用在生产环境.这些组件包括按钮(Button),导航(Navigation),缩略图( thumbnails),提醒(Alert) ...

  6. jQuery——超链接提示

    在熟悉jQuery过程中,练习超链接提示显示,发现书本上有个问题,经过查询资料,修改如下: <!DOCTYPE html> <html> <head> <ti ...

  7. 炫!一组单元素实现的 CSS 加载进度提示效果

    之前的文章个大家分享过各种类型的加载效果(Loading Effects),这里再给大家奉献一组基于单个元素实现的 CSS 加载动画集合.这些加载效果都是基于一个 DIV 元素实现的,十分强悍. 温馨 ...

  8. Fort.js – 时尚、现代的表单填写进度提示效果

    Fort.js 是一款用于时尚.现代的表单填写进度提示效果的 JavaScript 库,你需要做的就是添加表单,剩下的任务就交给 Fort.js 算法了,使用非常简单.提供了Default.Gradi ...

  9. SweetAlert – 替代 Alert 的漂亮的提示效果

    Sweet Alert 是一个替代传统的 JavaScript Alert 的漂亮提示效果.SweetAlert 自动居中对齐在页面中央,不管您使用的是台式电脑,手机或平板电脑看起来效果都很棒.另外提 ...

随机推荐

  1. ENode 1.0 - 消息的重试机制的设计思路

    项目开源地址:https://github.com/tangxuehua/enode 上一篇文章,简单介绍了enode框架中消息队列的设计思路,本文介绍一下enode框架中关系消息的重试机制的设计思路 ...

  2. 根据Excel的内容和word模板生成对应的word文档

    Sub setname() Dim I As Integer Dim pspname As String Dim pspnumber As String Dim path As String Dim ...

  3. [Unity3D]再次点击以退出程序

    [Unity3D]再次点击以退出程序 本文介绍为Android应用编写点击返回按键时的"再次点击以退出程序"的方法. +BIT祝威+悄悄在此留下版了个权的信息说: 下面是一个测试用 ...

  4. Linux grep与正则表达式

    grep命令         格式:grep [-acinv] [--color=auto] '查找字符串' filename -a 将binary文件以text文件的 -c 计算找到 ‘查找字符串’ ...

  5. 知方可补不足~用CDC功能来对数据库变更进行捕捉

    回到目录 如果我们希望监视一个数据表的变化,在sql2008之前的版本里,在数据库端可能想到的只有触发器,或者在程序端通过监视自己的insert,update,delete来实现相应的功能,这种实现无 ...

  6. EF架构~数据分批批量提交

    回到目录 对于大数据量提交,包括插入,更新和删除,我始终不建议用EF自带的方法,因为它会增加与数据库的交互次数,一般地,EF的一个上下文在提交时会打开一个数据连接,然后把转换成的SQL语句一条一条的发 ...

  7. 《Effective Java》—— 创建与销毁对象

    本篇主要总结的是<Effecticve Java>中关于创建和销毁对象的内容. 比如: 何时以及如何创建对象 何时以及如何避免创建对象 如何确保及时销毁 如何管理对象销毁前的清理动作 考虑 ...

  8. php实现注册

    <?php header("Content-Type:text/html;charset=gb2312"); @mysql_connect('localhost','root ...

  9. tabs左右滚动

    $(function () { //IdivLeft小于0,说明左边还有菜单,菜单总数大于8 //IdivLeft等于0,说明菜单总数小于8 //IdivLeft大于0,说明右边还有菜单,菜单总数大于 ...

  10. hibernate(六) cascade(级联)和inverse关系详解

    序言 写这篇文章之前,自己也查了很多的资料来搞清楚这两者的关系和各自所做的事情,但是百度一搜,大多数博文感觉说的云里雾里,可能博主自己清楚是怎么一回事,但是给一个不懂的人或者一知半解的人看的话,别人也 ...