gpt4 book ai didi

javascript - 使用 javascript 在其父级附近弹出显示

转载 作者:行者123 更新时间:2023-11-28 09:20:52 25 4
gpt4 key购买 nike

我的网页中有一些图像,我想在用户将鼠标悬停在每个图像附近时显示弹出窗口,而当用户将鼠标移动到其他位置时,弹出窗口消失

我在很多网站上都看到了这个功能,但我不知道如何做到这一点我看到了 jquery UI,但对话框与我的目标不符

你有什么想法吗

我刚刚测试过,但没有结果:

   <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>title</title>

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script>
$("#hover1").mouseenter(function() {
$("#content").fadeIn('fast');
});

$("#hover1").mouseleave(function() {
$("#content").fadeOut('slow');
});
</script>
</head>
<body>

<p id="hover1">
Hover here!
</p>
<div id="content" style="display:none">
Content here!
</div>

</body>
</html>

谢谢

最佳答案

用相对容器包装图像并放入绝对容器(弹出窗口)中,仅显示他(显示: block ;来自显示:无;)然后将包装容器悬停。不要忘记为弹出窗口设置 z-index。

关于javascript - 使用 javascript 在其父级附近弹出显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15003985/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com