Jquery的鼠标事件

下面的是我根据https://www.w3school.com.cn/jquery/event_mouseout.asp,然后自己写的一个小总结的代码。

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title></title><script type="text/javascript" src="./js/jquery.min.js"></script></head><body><div id="one" style="width: 50px; float: left;"><p>背景色</p></div><div id="two" style="width: 50px; float: left; margin: 16px 10px;"><span>背景色</span></div><script type="text/javascript">// 鼠标移入事件$("p").mouseover(function(){$("p").css("background-color","#00ffff");});// 鼠标移出事件$("#one p").mouseout(function(){$(this).css("background-color","#E9E9E4");});// 鼠标移入事件$("#two").mouseover(function(){$(this).css("background-color","#00ffff");});// 鼠标移出事件var two=$("#two");two.mouseout(function(){two.css("background-color","#E9E9E4");});</script></body>
</html>

Jquery的鼠标移入移出事件相关推荐

  1. jquery的鼠标移入移出事件hover、mouseenter、mouseleave、mouseover、mouseout

    hover:鼠标进入元素的子元素时不会触发'鼠标移开'的事件: mouseenter.mouseleave:效果与hover相同: mouseover: 鼠标进入元素和进入它的子元素时都会触发'mou ...

  2. jq鼠标移入移出显示和隐藏_jQuery实现鼠标移入移出事件切换功能示例

    这篇文章主要介绍了jQuery实现鼠标移入移出事件切换功能,结合实例形式分析了jQuery不同版本处理鼠标事件响应与触发相关操作技巧,需要的朋友可以参考下. jQuery实现鼠标移入移出事件切换功能 ...

  3. js(jquery)鼠标移入移出事件时,出现闪烁、隐藏显示隐藏显示不停切换的情况

    <script> $(".guanzhu").hover(function(){$(".weixinTop").show();},function( ...

  4. vue按钮移上去显示提示_vue 鼠标移入移出事件(移入出现按钮),element-ui表格移入移出...

    效果图: 注:@mouseenter="enter(index)" @mouseleave="leave()"   重点 下载 删除 data() { retu ...

  5. html鼠标移入移除事件,js鼠标移入移出事件样例

    javaScript实例 li{background-color:#eee;height:25px;margin-top:2px;} //添加鼠标移入移出事件 function fun(){ //获取 ...

  6. 鼠标移入移出事件,mouseover、mouseenter区别

    简单介绍: js中有两组鼠标移入移出事件:(旧的)mouseover.mouseout与(新的)mouseenter.mouseleave,不建议混着使用. 两者的区别是,新的鼠标移入移出事件,去掉了 ...

  7. web前端开发第二阶段——鼠标移入移出事件

    鼠标移入/移出事件 : 鼠标移入 :onmouseenter 鼠标移出 : onmouseleave <!DOCTYPE html> <html> <head>&l ...

  8. JavaScript事件委托之鼠标移入移出事件

    鼠标移入移出事件 <div class="parent">父元素<div class="child">子元素</div>&l ...

  9. vue中鼠标移入移出事件种类以及区别

    1.@mouseover与@mouseout 鼠标经过时自身触发事件,其子元素同时也触发该事件. 父亲有的东西,儿子也有 ,支持冒泡. 适用于鼠标移入移出时子元素也会执行事件的场景,或者单一标签. 2 ...

最新文章

  1. virtaulbox视图模式常用切换
  2. ESAComp 2020中文版
  3. 【状压DP】最优配对问题(jzoj 3420)
  4. springmvc怎么设置更改了界面不用重启_Microsoft Visual Studio 2019 更改语言包
  5. 8.2 css3 新增标签 盒子模型 长度单位 颜色 渐变 径像渐变
  6. web程序入门五(http无状态)
  7. Oracle数据库中正确的导入dmp数据库文件
  8. 可塑性极强渐变几何空间,设计中不可或缺的素材
  9. ElasticSearch.js源码走一个大概
  10. matlab迭代算法实例_【优化求解】基于NSGA2的求解多目标柔性车间调度算法
  11. python list()和[]的区别
  12. java常用的date类
  13. python3的字符串操作
  14. RHCE-ansible第三次实验,通过ansible自动化部署web服务
  15. 合并石头的最低成本问题
  16. 路由器桥接成功后,仍然没有网络
  17. 【ACWing】3626. 三元一次方程
  18. 什么是蛋白质结构域?什么是HTH?
  19. K-近邻算法(分类算法)
  20. 神经网络与矩阵表示之间的恩怨情仇

热门文章

  1. php数组转get字符串,php数组转字符串
  2. web前端入门到实战:纯css制作电闪雷鸣的天气图标
  3. XXL-Job学习笔记
  4. Rational Rose 2007 下载,安装及破解激活图文教程
  5. 链上人才专访:愿做区块链行业基石 | ArcBlock 媒体
  6. 解决mysql和java中文乱码的问题
  7. 漏洞扫描工具---Openvas
  8. 计算机端口错误678,电脑显示错误678怎么处理
  9. 一次将tensorflow中的tf.nn.conv2d优(re)雅(shape)的转化成torch.nn.F.conv2d的咸鱼操作
  10. 魅族魅蓝5x完美打开USB调试模式的步骤