首页 > 移动平台 > 详细

鼠标移动到一张图片时变为另一张图片

时间:2021-03-12 18:57:13      阅读:38      评论:0      收藏:0      [点我收藏+]

如何让鼠标移动到一张图片上时候图片变成另一张移开后又恢复原来的图片

vue 实现v-for循环回来的数据动态绑定id

1             <img class="center-block" :src="item.prc" :id="forId(index)" alt="logo"
2                  @mouseleave="zleave(item.prc,index)" @mouseenter="zenter(item.img,index)"
3                  style="height: 100%;width: 100%">

 在methods里面定义,鼠标移入移出事件,JQ id选择器更改图片的src属性就好了

 1   methods: {
 2     forId: function (index) {
 3       return "zimg" + index
 4     },
 5     zleave(imgsrc, index) {
 6       document.getElementById("zimg" + index).src = imgsrc;
 7     },
 8     zenter(imgsrc, index) {
 9       document.getElementById("zimg" + index).src = imgsrc;
10     }14     },

 

鼠标移动到一张图片时变为另一张图片

原文:https://www.cnblogs.com/LilLazy/p/14524856.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!