<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. Error after SQL Server 2012 installation: Login Failure for "SQL Server Integration Services 11.0" SSIS service

    When you install SQL Server 2012 and you try to connect to SSIS services, you cannot due to that the ...

  2. BZOJ 3130: [Sdoi2013]费用流 网络流 二分 最大流

    https://www.lydsy.com/JudgeOnline/problem.php?id=3130 本来找费用流的题,权当复习一下网络流好了. 有点麻烦的是double,干脆判断大小或者二分增 ...

  3. bzoj 1209

    三维凸包裸题. 1.通过volume计算有向体积,判断点与面的位置关系. 2.噪声 /********************************************************* ...

  4. play framework系列之打包war

    概览 Play framwork 是我们一直在使用的框架,从刚开始的简单使用,乱起八糟的jar包引用,项目组成员之间的下载项目之后的引用问题等,遇到各种问题,我都一一解决,我将在这个系列中奉上解决方案 ...

  5. BZOJ 4521 CQOI 2016 手机号码 数位DP

    4521: [Cqoi2016]手机号码 Time Limit: 10 Sec  Memory Limit: 512 MBSubmit: 539  Solved: 325[Submit][Status ...

  6. ACdream 速攻组~

    1007 a + b /*这题就是一个快速幂,但是十分猥琐的是,模是1e10 + 7,不是1e9 + 7,这就产生了一个爆long long的问题.所以要对快速幂中的乘法操作进行一下改造.请教了BIT ...

  7. wikioi 3130 CYD刷题(背包）

    题目描述 Description 下午,CYD要刷题了,已知CYD有N题可刷,但他只有M分钟的时间,而且他的智慧值为Q,也就是说他只能做出难度小于等于Q的题目.已知每题可得积分Ai,需花费时间Bi,难 ...

  8. 使用命令行编译和运行 c、Java和python程序

    集成开发环境已经非常方便,从编写程序到执行程序看到结果,让我们不用关心中间的过程.但是使用原始的.命令的方式来将程序编译运行有的时候可能有些用,比如写个简答的程序,或者是身边没有集成工具的时候. C语 ...

  9. leetcode660. Remove 9

    leetcode660. Remove 9 题意: 从整数1开始,删除任何包含9的整数,如9,19,29 ... 所以现在,你将有一个新的整数序列:1,2,3,4,5,6,7,8,10,11,... ...

  10. Vue基础知识简介

    基础知识: vue的生命周期: beforeCreate/created.beforeMount/mounted.beforeUpdate/updated.beforeDestory/destorye ...