html鼠标悬停事件高亮显示，如图效果，求完整源代码。本人小白白

<!DOCTYPEhtml><html><head><title>测试</title></head><body>                                。
>                                                     。
td>23                                                                    

请教如何实现鼠标悬停提示框

//使用鼠标显示图层。
本层内容为div1的内容functionhowTip(e,content,ifhave){//if(!e)e=window.event;//alert(e);if(ifhave==null||ifhave=='0')return;//vardiv1=document.getElementById('divdisplay');//将出现的图层//div1[xss_clean]="Notes:"+content;vardiv1=document.getElementById(content);//将要显示的图层varx,x1;vary,y1;if(window.event){e=window.event;x=(e.clientX+document.body.scrollLeft+10);//当前鼠标位置(x+400)>document.body.client宽度){x=x-400;}if((y+150)>document.body.clientHeight){y=y-150-6;}}else{x=(e.pageX+10);//鼠标当前X位置，加10向右移动10p。
x可以更方便的查看内容y=(e.pageY+6);//if((x+400)>document.body.clientWidth){x=x-400;}if((y+150)>document.body.clientHeight){y=y-150-6;}}div1.style.left=x+"px";//当前鼠标位置";div1.style.display="block";//div1的初始状态是不可见的，可以设置为可见//window.event代表事件状态，比如事件发生的元素、键盘状态、鼠标位置、按钮状态mouse//clientX是鼠标指针相对于客户区x坐标的位置，其中客户区不包括窗口自身的控件和滚动条div1.style.position="absolute";//这个属性应该。
必须指定，否则div1图层将无法跟随鼠标移动}//关闭div1图层的显示functioncloseTip(event,divid){//vardiv1=document.getElementById('divdisplay');//div1.style.display="none";document.getElementById(divid).style.display="none";}

htmlhover鼠标悬停动画

探索HTMLhoverMusover动画，体验视觉交互的魔力。
下面展示了另外三个界面示例，通过鼠标悬停触发动画效果，使用户体验更加生动。
在第一个示例中，将鼠标悬停在按钮上，观察原木从无形到有形并缓慢下落的惊人转变。
在第二个例子中，当飞行时，小方块立即变成一个大方块，就像魔法一样出现在屏幕上。
第三个例子中，即使在悬停之后，小方块也逐渐转变为大方块，不过这次的转换过程类似于图片，细腻流畅，利用CSS的transition属性实现了平滑过渡。
虽然第二个和第三个例子的动画效果类似，但第三个例子使用了过渡来逐渐活跃效果，使整个过程更加生动自然50px，仿佛置身于太空中。
每个动画设计都巧妙地利用HTML和CSS的结合，通过易变事件触发变化，给用户带来视觉惊喜和交互体验，使按钮不仅仅是一个简单的操作元素，更是一种交互设计。

如何在网页中实现鼠标悬停文字显示效果？

通过CSS伪类中的“悬停”实现。

1.新建一个HTML文件，在body标签中添加一个div标签，在div标签中插入一个p标签，然后添加p标签的内容。
这里以“演示文本”为例。
示例：

2.在head标签中添加style标签，然后在style标签中设置p标签的预显示样式。
首先不显示，所以将p标签设置为属性代码“p{display:none;}”；然后设置div的宽度和高度，为了演示方便，将div的背景颜色设置为灰色代码。
:"div{width:100px;height:100px;background:#ccc;}":

3.在div标签中添加hover伪类，然后输入aspace，然后设置此时的样式显示p标签代码：“div:hoverp{display:block;}”这段代码的含义是当鼠标悬停在div元素上时，p标签的显示状态会从隐藏变为显示，文字p标签中的内容将显示：

4.当鼠标移离div元素时，文本将消失：

。