javascript - 将点击转换为 onmouseover javascript

标签 javascript html css

我想将点击事件更改为 onmouseover 事件以打开我的 div 然后如果鼠标离开我的 div 再次隐藏,就像一个下拉菜单,任何人都可以帮助我。

HTML代码:

<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Papermashup.com | Sliding Div</title>
<script src="jquery.js" type="text/javascript"></script>
<script src="dropdown/drop.js" type="text/javascript"></script>
<link type="text/css" href="dropdown/drop.css" rel="stylesheet"/>

</head>

<body>
 <a href="#" class="show_hide" onmouseover="this.#" >Show/hide</a><br />
    <div class="slidingDiv" style="width:103px;height:60px;">
        <img alt="" height="80" src="images/dropdown.png" width="103">
    </div>
</body>
</html>

CSS 代码:

.show_hide {
    display:none;
}

JavaScript 代码:

$(document).ready( function() {

    $(".slidingDiv").hide();
    $(".show_hide").show();

    $('.show_hide').click( function() {
         $(".slidingDiv").slideToggle();
    });

});

最佳答案

尝试

 $(".show_hide").mouseenter(function() {
       $(".slidingDiv").slideToggle();
  })

关于javascript - 将点击转换为 onmouseover javascript,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13157767/

相关文章:

css - 使用 Bootstrap 4 布局表单数据(用于 Django 模板中的 endfor/data)

javascript - Observable 和 Promise.all 的区别

javascript - 如何在 Canvas 上画一个简单的五边形

html - 如何使用 ID 处理 Sketch 导出的 SVG

css - 用CSS装饰浏览按钮

jQuery 计数类为 "checked"的元素

javascript - 我需要 Firestore 查询来检查对象是否已定义

javascript - 基本的javascript Accordion

javascript - 每个 JavaScript 程序都是 TypeScript 程序吗?

html - 使用 HTML 属性的边框折叠