<html>
<head>
<meta charset="utf-8">
<title>无标题页</title>
<script type="text/javascript" src="jquery-1.8.3.min.js"></script>
<script type="text/javascript" language="javascript">
$(function(){
var x=;
var y=;
$("a.tooltip").mouseover(function(e){
this.myTitle=this.title;
this.title="";
var tooltip="<div id='tooltip'>"+this.myTitle+"</div>"; //创建DIV元素
$("#link").append(tooltip); //追加到文档中
$("#tooltip").css({"top": (e.pageY+y) + "px","left": (e.pageX+x) + "px"}).show(); //设置X Y坐标, 并且显示
}).mouseout(function(){
this.title=this.myTitle;
$("#tooltip").remove(); //移除
}).mousemove(function(e){
$("#tooltip").css({"top": (e.pageY+y) + "px","left": (e.pageX+x) + "px"});
})
})
</script>
<style>
#tooltip{
border:1px solid red;
background:#FF6;
position:absolute;
padding:1px;
color:#;
display:none;
}
</style>
</head>
<body>
<div id="link">
<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>
</div>
</body>
</html>

title属性:
  使用 title 属性,可以让鼠标悬停在超链接上的时候,显示该超链接的文字注释。

<a href="http://www.baidu.cn" title = "百度的的中文站点">百度网站</a>

  如果希望注释多行显示,可以使用 作为换行符。

<a href="http://www.baidu.cn" title = "百度的
中文站点">百度网站</a>

手写一个关于title属性自定义提示框解决浏览器(IE)不兼容问题的更多相关文章

  1. 放弃antd table,基于React手写一个虚拟滚动的表格

    缘起 标题有点夸张,并不是完全放弃antd-table,毕竟在react的生态圈里,对国人来说,比较好用的PC端组件库,也就antd了.即便经历了2018年圣诞彩蛋事件,antd的使用者也不仅不减,反 ...

  2. 剖析手写Vue,你也可以手写一个MVVM框架

    剖析手写Vue,你也可以手写一个MVVM框架# 邮箱:563995050@qq.com github: https://github.com/xiaoqiuxiong 作者:肖秋雄(eddy) 温馨提 ...

  3. 手把手教你手写一个最简单的 Spring Boot Starter

    欢迎关注微信公众号:「Java之言」技术文章持续更新,请持续关注...... 第一时间学习最新技术文章 领取最新技术学习资料视频 最新互联网资讯和面试经验 何为 Starter ? 想必大家都使用过 ...

  4. 浅析MyBatis(二):手写一个自己的MyBatis简单框架

    在上一篇文章中,我们由一个快速案例剖析了 MyBatis 的整体架构与整体运行流程,在本篇文章中笔者会根据 MyBatis 的运行流程手写一个自定义 MyBatis 简单框架,在实践中加深对 MyBa ...

  5. 『练手』手写一个独立Json算法 JsonHelper

    背景: > 一直使用 Newtonsoft.Json.dll 也算挺稳定的. > 但这个框架也挺闹心的: > 1.影响编译失败:https://www.cnblogs.com/zih ...

  6. 教你如何使用Java手写一个基于链表的队列

    在上一篇博客[教你如何使用Java手写一个基于数组的队列]中已经介绍了队列,以及Java语言中对队列的实现,对队列不是很了解的可以我上一篇文章.那么,现在就直接进入主题吧. 这篇博客主要讲解的是如何使 ...

  7. 【spring】-- 手写一个最简单的IOC框架

    1.什么是springIOC IOC就是把每一个bean(实体类)与bean(实体了)之间的关系交给第三方容器进行管理. 如果我们手写一个最最简单的IOC,最终效果是怎样呢? xml配置: <b ...

  8. 只会用就out了,手写一个符合规范的Promise

    Promise是什么 所谓Promise,简单说就是一个容器,里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果.从语法上说,Promise 是一个对象,从它可以获取异步操作的消息.Prom ...

  9. webview的简单介绍和手写一个H5套壳的webview

    1.webview是什么?作用是什么?和浏览器有什么关系? Webview 是一个基于webkit引擎,可以解析DOM 元素,展示html页面的控件,它和浏览器展示页面的原理是相同的,所以可以把它当做 ...

随机推荐

  1. 希尔排序之C++实现(高级版)

    希尔排序之C++实现(高级版) 一.源代码:ShellSortHigh.cpp /*希尔排序基本思想: 先取一个小于n的整数d1作为第一个增量,把文件的全部记录分组. 所有距离为d1的倍数的记录放在同 ...

  2. [BZOJ5305][HAOI2018]苹果树(DP)

    首先注意到每种树都是等概率出现的,于是将问题转化成计数求和问题. f[n]表示所有n个点的树的两两点距离和的总和. g[n]表示所有n个点的树的所有点到根的距离和的总和. h[n]表示n个点的树的可能 ...

  3. BZOJ 3572: [Hnoi2014]世界树 虚树 树形dp

    https://www.lydsy.com/JudgeOnline/problem.php?id=3572 http://hzwer.com/6804.html 写的时候参考了hzwer的代码,不会写 ...

  4. 【Trie】【枚举约数】Codeforces Round #482 (Div. 2) D. Kuro and GCD and XOR and SUM

    题意: 给你一个空的可重集,支持以下操作: 向其中塞进一个数x(不超过100000), 询问(x,K,s):如果K不能整除x,直接输出-1.否则,问你可重集中所有是K的倍数的数之中,小于等于s-x,并 ...

  5. http状态码学习笔记

    当浏览者访问一个网页时,浏览者的浏览器会向网页所在服务器发出请求.当浏览器接收并显示网页前,此网页所在的服务器会返回一个包含HTTP状态码的信息头(server header)用以响应浏览器的请求. ...

  6. MCP2515 : SPI CAN controller management

    #ifndef __MCP2515_H #define __MCP2515_H /* mcp2515.h This file contains constants that are specific ...

  7. 使用 C++ 的 StringBuilder 提升 4350% 的性能

    http://blog.jobbole.com/109663/?utm_source=blog.jobbole.com&utm_medium=relatedPosts http://msdn. ...

  8. Linux系统不可不知的命令:sudo

    转自:http://www.embeddedlinux.org.cn/html/xinshourumen/201308/05-2608.html sudo是个统管一切的命令.它的字面意思是代表“超级用 ...

  9. 《学习opencv》笔记——矩阵和图像操作——cvInRange,cvInRangeS,cvInvert and cvMahalonobis

    矩阵和图像的操作 (1)cvInRange函数 其结构 void cvInRange(//提取图像中在阈值中间的部分 const CvArr* src,//目标图像 const CvArr* lowe ...

  10. https跳转到http的过程在IE6中存在BUG(Bea-090475)

    前段时间做OA系统的https的安全登录功能(以前登录是采用的一般的http方式,后因为安全性考虑需要改成https的方式)在本机测试完全通过. 可是近期同事发现在测试环境下用IE6访问会出现不能访问 ...