jquery写出移入移出事件

简介: jquery写出移入移出事件
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1">
    <script src="js/jquery-3.6.0.js"></script>
    <style>
      #box{
        width: 50%;
        height: 300px;
        margin-left: 30%;
        margin-top: 300px;
      }
      #box_one input{
        width: 50%;
        height: 20px;
        border-radius: 20px;
      }
      #box_tow{
        width: 52%;
        height: 100px;
        background-color: bisque;
        border-radius: 20px;
        /* 显示滚动条 */
        overflow-y: scroll;
        display: none;
      }
    </style>
        <title></title>
    </head>
    <body>
       <div id="box">
        <div id="box_one">
          <input type="text" placeholder="请输入">
        </div>
    <div id="box_tow">
      <p>求关注</p>
      <p>求点赞</p>
      <p>求关注</p>
      <p>求点赞</p>
    </div>
       </div>
        <script type="text/javascript">
            $('#box_one').mousemove(function() {
              $("#box_tow").show()//当鼠标放到input里时显示#box_tow里的数据
            })
            $('#box_tow').mousemove(function() {
              $("#box_tow").show()//把鼠标放到box_tow的时候继续显示避免隐藏
            })
            $('#box_tow').mouseout(function() {
              $("#box_tow").hide()//鼠标离开input后隐藏box_tow
            })
        </script>
    </body>
</html>
相关文章
|
3月前
|
JavaScript
JQuery——动态添加元素导致点击事件失效
JQuery——动态添加元素导致点击事件失效
41 0
|
3月前
|
图形学
小功能⭐️Unity Button按钮实现鼠标移入移出触发相应事件
小功能⭐️Unity Button按钮实现鼠标移入移出触发相应事件
|
6月前
|
JavaScript
js的鼠标移入移出事件
js的鼠标移入移出事件
|
6月前
|
JavaScript
jQuery事件2-第6次课-给未来的元素绑事件-事件对象-JS盒模型-附案例、任务
jQuery事件2-第6次课-给未来的元素绑事件-事件对象-JS盒模型-附案例、任务
67 0
|
JavaScript
jquery写出移入移出事件
jquery写出移入移出事件
65 0
|
JavaScript 测试技术 索引
Easyui 关闭jquery-easui tab标签页前触发事件
Easyui 关闭jquery-easui tab标签页前触发事件
114 0
|
移动开发 JavaScript
原生js拖拽元素(onmouseup不能够触发的原因)
原生js拖拽元素(onmouseup不能够触发的原因)
|
JavaScript PHP
jquery同时给两个元素绑定同一个click事件
jquery同时给两个元素绑定同一个click事件
470 0
|
存储 JavaScript 前端开发
JavaScript 技巧篇-js增加延迟时间解决单击双击事件冲突,双击事件触发单击事件
JavaScript 技巧篇-js增加延迟时间解决单击双击事件冲突,双击事件触发单击事件
807 0