Der Anmerkungsteil kann auch implementiert werden. Der Titel wird an einer festen Position angezeigt, und der Standardtitel wird nicht angezeigt.
HTML-Webseiten werden hauptsächlich verwendet Für die Erstellung von Websites ist das Benutzererlebnis das Wichtigste. Wie sieht es mit der Verbesserung des Benutzererlebnisses aus? Beginnen wir mit den Details. Wie fügt man also Hinweise zu Textlinks in HTML hinzu?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>body {
margin: 0;
padding: 40px;
background: #fff;
font: 80% Arial, Helvetica, sans-serif;
color: #555;
line-height: 180%;
}
p {
clear: both;
margin: 0;
padding: .5em 0;
}/* tooltip */#tooltip {
position: absolute;
border: 1px solid #333;
background: #f7f5d1;
padding: 1px;
color: #333;
display: none;
}</style>
<script src="js/jquery-1.11.3.min.js"></script>
<script>$(function () {// var v;var x=10;var y=20;
$("a.tooltip").mouseover(function (e) {// v=$(this).attr("title");//把class .tooltip中的值取到// $(this).attr("title","");//把原来的titile清空this.myTitle=this.title;this.title="";var tooltip=$("<div id='tooltip'>"+this.myTitle+"</div>");//把class .tooltip中的值传给新元素#tooltiptooltip.appendTo("body");var json={ "top":e.pageY+y+"px", "left":e.pageX+x+"px"};
$("#tooltip").css(json).show("fast");
}).mouseout(function () {
$("#tooltip").remove();//把元素删除，不能用hide();// $(this).attr("title",v);//把原来的属性值添加回来this.title=this.myTitle;
});
})</script>
</head>
</head>
<body>
<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>
</body>
</html>
Das obige ist der detaillierte Inhalt vonBeispielcode für Textaufforderungen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
