关键知识点:

  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. 我的ORM之十三 -- 性能参数

    我的ORM索引 测试环境 台式机: 主板:映泰Z77 CPU:i5 3470(3.2GHz) 内存:DDR3 1600 8G(单条) 硬盘:创见 SSD 256G ORM从过程上,可以分两个大的部分: ...

  2. openwrt-智能路由器hack技术(1)---"DNS劫持"

    openwrt-智能路由器hack技术(1)---"DNS劫持" 1   导读 PS:之前写的一个文章,现在发现结构内容排版不是太好,导致阅读体验太差,影响传播和SEO,所以现在整 ...

  3. SpeechLib 语音播报

    SpeechLib这的dll专门用来播放语音,能够识别英语.简体和繁体.并且可以播放声音文件,支持WAV格式,但不支持MP3.在报警场合下已经够用了. 基本播放语音及文件.支持异步. using Sy ...

  4. 【开源】开发者新闻聚合APP 2.0.3发布(第二个稳定版本)

    聚合了博客园新闻.infoq新闻.36kr新闻.oschina新闻.51cto新闻.csdn新闻: 争取做到随时刷随时有开发者的新闻! 目前还只支持安卓APP 但用的人多了,我会发布苹果版的APP 最 ...

  5. 网络异步编程(C#)团购课

    新生命开发团队大石头讲解网络异步编程(C#) 内容:网络编程基础.IOCP.APM.SAEA 时长:2~3小时 价格:20元,20人及以上成团,http://item.taobao.com/item. ...

  6. IOS UIView 03- 自定义 Collection View 布局

    注:本人是翻译过来,并且加上本人的一点见解. 前言 UICollectionView 在 iOS6 中第一次被引入,也是 UIKit 视图类中的一颗新星.它和 UITableView 共享一套 API ...

  7. Java基础之如何解决斗地主问题

        难的是逻辑的分析,把逻辑转化成代码是一种能力,这种能力需要多练习总结.     多多指教,共同进步. 问题: 要求实现斗地主游戏发牌过程,打印三个玩家的牌和底牌.在不看底牌的情况下,统计出三个 ...

  8. HTML学习入门

    HTML(元素.属性) HTML: 超文本标记语言   1. 超文本即为带有链接属性的文本  2.标记即为标签 一.body属性: bgcolor:页面背景颜色 text:文字颜色 backgroun ...

  9. Ecshop :后台添加新功能 菜单及 管理权限 配置

    需求:在<商品管理>下增加一项[商品推广管理]功能 一. 添加菜单项 打开 /admin/includes/inc_menu.php 文件(后台框架左边菜单),在最后添加一行如下: $mo ...

  10. 搭建LNAMP环境(四)- 源码安装PHP7

    上一篇:搭建LNAMP环境(三)- 源码安装Apache2.4 一.安装PHP7 1.yum安装编译php需要的包 yum -y install libxml2 libxml2-devel curl- ...