按钮Jquery上的工具提示
我发现了一个关于鼠标悬停在链接上时如何显示工具提示的课程。 我尝试了相同的代码，但使用了按钮。当我将鼠标悬停在鼠标上方时，工具提示会出现，但它们会一起出现，我不希望这样 以下是代码示例：按钮Jquery上的工具提示,jquery,html,Jquery,Html,我发现了一个关于鼠标悬停在链接上时如何显示工具提示的课程。 我尝试了相同的代码，但使用了按钮。当我将鼠标悬停在鼠标上方时，工具提示会出现，但它们会一起出现，我不希望这样 以下是代码示例： <head> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript" ></script> <script src="toolt
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript" ></script>
<script src="tooltip.js" type="text/javascript" ></script>
<style>
.toolTip {
padding-right: 20px;
background: url(images/help.gif) no-repeat right;
color: #3366FF;
cursor: help;
position: relative;
}
.toolTipWrapper {
width: 175px;
position: absolute;
top: 20px;
display: none;
color: #FFF;
font-weight: bold;
font-size: 9pt;
}
.toolTipMid {
padding: 8px 15px;
background: #A1D40A url(images/tooltip.gif) top;
}
</style>
</head>
<body>
<span class="toolTip" title="Click here to start a new draw"> <input type="submit" value="New Draw" style="width:150; text-align:left; "></span></input>
<span class="toolTip" title="Finally when you finish drawing the page, click on this button. The image will be displayed at the bottom."><input type="button" id="save" value="Save Draw" style="width:150; text-align:center; margin-left:40"/></span></input>
</body>
</html>
.工具提示{
右边填充：20px；
背景：url（images/help.gif）无重复权限；
颜色：#3366FF；
光标：帮助；
位置：相对位置；
}
.toolTipWrapper{
宽度：175px；
位置：绝对位置；
顶部：20px；
显示：无；
颜色：#FFF；
字体大小：粗体；
字号：9pt；
}
.ToolTipID{
填充：8px 15px；
背景：#A1D40A url（images/tooltip.gif）顶部；
}
$(document).ready(function() {
$('.toolTip').hover(
function() {
this.tip = this.title;
$(this).append(
'<div class="toolTipWrapper">'
+'<div class="toolTipMid">'
+this.tip
+'</div>'
+'</div>'
);
this.title = "";
$('.toolTipWrapper').fadeIn(300);
},
function() {
$('.toolTipWrapper').fadeOut(100);
this.remove();
this.title = this.tip;
}
);
});
$（文档）.ready（函数（）{
$（'.toolTip'）。悬停(
函数（）{
this.tip=this.title；
$（此）。附加(
''
+''
+这是小费
+''
+''
);
this.title=“”；
$（'.toolTipWrapper'）.fadeIn（300）；
},
函数（）{
$（'.toolTipWrapper'）.fadeOut（100）；
这个。删除（）；
this.title=this.tip；
}
);
});
$(document).ready(function() {
$('.toolTip').hover(
function() {
this.tip = this.title;
$(this).append('<div class="toolTipWrapper">' + '<div class="toolTipMid">' + this.tip + '</div>' + '</div>');
this.title = "";
$('.toolTipWrapper', this).fadeIn(300);
}, function() {
$('.toolTipWrapper', this).fadeOut(100);
this.remove();
this.title = this.tip;
});
});
$（文档）.ready（函数（）{
$（'.toolTip'）。悬停(
函数（）{
this.tip=this.title；
$（this.append（“”+“”+this.tip+“”+“”）；
this.title=“”；
$（'.toolTipWrapper'，this.fadeIn（300）；
}，函数（）{
$（'.toolTipWrapper'，this）.fadeOut（100）；
这个。删除（）；
this.title=this.tip；
});
});
所以所有的改变都是
$（'.toolTipWrapper'，this）