a 标签中 title 属性样式修改
无文字描述,直接上测试页,看效果。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"> <style>
#tplink{border:1px solid red; background:#FF6;
position:absolute;
padding:1px;
color:red;
display:none;
border-radius: 3px;
}
</style>
<script type="text/javascript" src="jquery\v1.8.3\jquery.min.js"></script>
<script type="text/javascript">
$(function(){
var x=-210;
var y=-160;
$("a.tplink").mouseover(function(e){
this.myTitle=this.title;
this.title="";
var tooltip="<div id='tplink'>"+this.myTitle+"</div>"; //创建DIV元素
$("#link").append(tooltip); //追加到文档中
$("#tplink").css({"top": (e.pageY+y) + "px","left": (e.pageX+x) + "px"}).show(); //设置X Y坐标, 并且显示
}).mouseout(function(){
this.title=this.myTitle;
$("#tplink").remove(); //移除
}).mousemove(function(e){
$("#tplink").css({"top": (e.pageY+y) + "px","left": (e.pageX+x) + "px"});
})
})
</script>
<title>超链接title样式修改</title>
</head> <body>
<div id="link">
<p><a href="#" class="tplink" title="自定义title">自定义title</a></p>
<p><a href="#" title="默认title">默认title</a></p>
</div>
</body>
</html>
效果图:

a 标签中 title 属性样式修改的更多相关文章
- img标签中alt属性与title属性在seo的作用-摘自网友
img标签中alt属性与title属性作用,也许大家比较迷惑,现在给大家举例说明.alt属性是图片的替换文字.title属性规定元素的额外信息,有视觉效果. 目录 alt属性 title属性 ie和f ...
- input placeholder属性 样式修改(颜色,大小,位置)
placeholder属性 样式修改 <!DOCTYPE html> <html> <head> <meta charset="utf-8" ...
- a标签中href属性引起的页面不跳转问题
先简单描述问题,今天在做一个简单的提交页面的时候,碰到了跳转不了的问题.其中a标签的形式<a href="" onclick="submit()"> ...
- html中title属性换行实现
本文主要讲解titile属性换行的实现方式.<title> 元素可定义文档的标题,可以应用在img.a等标签上. 1.实现方式: <!DOCTYPE html> <htm ...
- html的meta总结,html标签中meta属性使用介绍(转)
html的meta总结,html标签中meta属性使用介绍 2014年11月5日 5928次浏览 引子 之前的我的博客中对于meta有个介绍,例如:http://www.haorooms.com/po ...
- JSTL的forEach标签中的属性具体含义
JSTL的forEach标签在JSP页面经常替代Java脚本的循环语句,生成多个记录的信息.一般只需 一个一个的展示记录即可,有些需要获取当前记录的索引.在需要获取当前记录的索引的时候可能 有点麻烦, ...
- 解决vue中element组件样式修改无效
vue中element组件样式修改无效 <style> .detail{ .el-input__inner { height: 48px; } } </style> 直接写st ...
- 浅析网页meta标签中X-UA-Compatible属性的使用
今天有一个做开发的朋友突然问你知道很多网站上面加入的X-UA-Compatible属性的意义么?其实这个在以前还专门花了一点时间来验证我自己的想法,结果也确实如自己所预想的那样,八九不离十,当然有一点 ...
- 修改表单元素中placeholder属性样式、清除IE浏览器中input元素的清除图标和眼睛图标
一.修改input元素placeholder属性样式 在做项目的时候,一般表单元素的placeholder属性样式都是使用浏览器默认的,但有时候为了追求设计上的美感需要修表单元素的placeholde ...
随机推荐
- Hadoop:WordCount分析
相关代码: package com.hadoop; import org.apache.hadoop.conf.Configuration; import org.apache.hadoop.fs.P ...
- crontab时间规则
sudo crontab -e 5 * * * *每小时第5分钟执行*/5 * * * *每5分钟执行0 2 * * * 每天凌晨2点执行 cron是一个linux下的定时执行工具,可以在无需人工干预 ...
- 责任链模式的使用-Netty ChannelPipeline和Mina IoFilterChain分析
本文来自网易云社区 作者:乔安然 1. Chain of Responsiblity 定义: 使多个对象都有机会处理请求,从而避免请求的发送者和接受者之间的耦合关系.将这个对象连成一条链,并沿着这条链 ...
- java 泛型类转型
public class NeedCasting { @SuppressWarnings("unchecked") public void f(String[] args)thro ...
- vi/vim 命令使用详解
1.Linux下创建文件 vi test.txt 或者 vim test.txt 或者 touch test.txt 2.vi/vim 使用 基本上 vi/vim 共分为三种模式,分别是命令模式(Co ...
- 修改npm全局安装模式的路径
由于npm全局模块的存放路径及cache的路径默认是放在C盘下,这样肯定会增加C盘的负担,那么如果需要修改其存放路径应该怎么做呢? 第一步:在nodejs安装目录(也可以指定其它目录)下创建”node ...
- ADB常用指令
adb 命令是adb程序自带的一些命令:adb shell则是调用Android系统的命令,Android系统特有的命令都放在Android设备的/system/bin目录中 MonkeyRunner ...
- PAT——乙级1006:换个格式输出整数&乙级1021:个位数统计&乙级1031:查验身份证
1006 换个格式输出整数 (15 point(s)) 让我们用字母 B 来表示“百”.字母 S 表示“十”,用 12...n 来表示不为零的个位数字 n(<10),换个格式来输出任一个不超过 ...
- errno -4058 and npm WARN enoent ENOENT 解决方案
1.报错如下: npm WARN checkPermissions Missing write access to C:\Users\hejinrong\AppData\Roaming\npm\nod ...
- DFS(2)——hdu1241Oil Deposits
一.题目回顾 题目链接:Oil Deposits 题意:给你一块网格,网格被分为面积相等的地块,这些地块中标记'@'的是油田,标记'*'的不是油田.已知一块油田与它上下左右以及对角线的油田同属一片油区 ...