Posted in Javascript onDecember 26, 2013
<html> <head> <meta charset="utf-8"/> <script type="text/javascript" src="script/jquery-1.4.2.min.js"></script> <script> /*文字提示*/ /* (1)鼠标移入的时候,创建一个div它的内容是title属性的值 (2)规定位置,设置css样式 (3)鼠标移出的时候,移除div (4)鼠标移动的时候,X Y轴的坐标要相应的变化 */ $(function(){ var x = 7; var y = 8; $("a.tip").hover(function(){ var title = this.title; var $div = $("<div id='newTip'>"+title+"</div>"); $("body").append($div); $div.css({"position":"absolute","background":"pink"}); },function(){ $("#newTip").remove(); }).mousemove(function(e){ var $div = $("#newTip").css({"left":(e.pageX+x)+'px',"top":(e.pageY+y)+'px'}); }); }) </script> </head> <body> <a href="#" class="tip" title="这是我的提示">这是我的提示</a> </body> </html>
利用jQuary实现文字浮动提示效果示例代码
声明:登载此文出于传递更多信息之目的,并不意味着赞同其观点或证实其描述。
Reply on: @reply_date@
@reply_contents@