Maison > interface Web > js tutoriel > 利用jQuary实现文字浮动提示效果示例代码_jquery

利用jQuary实现文字浮动提示效果示例代码_jquery

WBOY
Libérer: 2016-05-16 17:06:44
original
1144 Les gens l'ont consulté
复制代码 代码如下:





<script> <BR>/*文字提示*/ <BR>/* <BR>(1)鼠标移入的时候,创建一个div它的内容是title属性的值 <BR>(2)规定位置,设置css样式 <BR>(3)鼠标移出的时候,移除div <BR>(4)鼠标移动的时候,X Y轴的坐标要相应的变化 <BR>*/ <BR>$(function(){ <BR>var x = 7; <BR>var y = 8; <BR>$("a.tip").hover(function(){ <BR>var title = this.title; <BR>var $div = $("<div id='newTip'>"+title+"</script>
");
$("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'});
});
})



这是我的提示


Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal