利用javascript实现鼠标悬浮提示效果

最新推荐文章于 2023-08-28 16:31:58 发布

S117

最新推荐文章于 2023-08-28 16:31:58 发布

阅读量3.6k

点赞数

文章标签： javascript button function div input html

本文链接：https://blog.csdn.net/longtian1213/article/details/7766474

版权

本文介绍了如何使用JavaScript实现简单的鼠标悬浮提示效果。通过在HTML元素上设置tip属性，然后在页面加载后检测并添加鼠标经过事件。当鼠标悬停时，动态创建提示DIV并显示在鼠标下方，移开鼠标则隐藏提示。

摘要由CSDN通过智能技术生成

做了个很简单的鼠标悬浮提示的DEMO，基本思想如下

1、为需要提示的HTML标签添加一个tip属性，属性值就是悬浮提示的内容，

2、但页面加载完毕之后，检查所有的标签，如果发现有tip属性，则为这个标签添加一个鼠标经过事件

3、但鼠标经过时创建一个提示的DIV，添加到鼠标的末尾，但鼠标离开时，将这个DIV隐藏，

其实想做做个简单的悬浮提示很简单，就上面那几部

代码如下：

<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
	</head>
	<body >
		<input type="button" value="button" id="button" tip="这是一个按钮"/>
		<input type="button" value="button1" id="button1" tip="这是另一个按钮"/>
	</body>
	<script type="text/javascript">
		document.body.onload = function(){
			var objs = document.getElementsByTagName("*");
			for(var i = 0 ;i < objs.length ; i ++){

最低0.47元/天解锁文章

S117

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
利用javascript实现鼠标悬浮提示效果

做了个很简单的鼠标悬浮提示的DEMO，基本思想如下 1、为需要提示的HTML标签添加一个tip属性，属性值就是悬浮提示的内容， 2、但页面加载完毕之后，检查所有的标签，如果发现有tip属性，则为这个标签添加一个鼠标经过事件 3、但鼠标经过时创建一个提示的DIV，添加到鼠标的末尾，但鼠标离开时，将这个DIV隐藏，其实想做做个简单的悬浮提示很简单，就上面那几部代码如下：
复制链接

扫一扫