vue鼠标悬停文字变色1
@mouseover(): 鼠标”进入”悬停区域,触发此方法
@mouseleave(): 鼠标”离开”悬停区域,触发此方法
1、Template
<div class="introduceLittleTitle"
@mouseenter="footerEnter()"
@mouseleave="footerLeave()"
:style="activeColor"><span>健康风险评估中心</span></div>
2、script
data(){
return{
activeColor:"color : #ffffffb8",//悬停区文字原始颜色
}
},
methods:{
footerEnter(){
this.activeColor="color : #ffffff";//悬停区改变文字原始颜色
},
footerLeave(){
this.activeColor="color : #ffffffb8";//悬停区恢复文字原始颜色
},
},
还没有评论,来说两句吧...