js图片滚动鼠标移上去放大

JavaScript021

js图片滚动鼠标移上去放大,第1张

<html>

<head>

</head>

<body>

<div id="marqueeDiv"style="position:absoluteleft:0px"><img src="1.jpg" style="width:100px" onmouseover="showImg(this)"></div>

<script type="text/javascript">

var width=document.body.offsetWidth-100

var left=0

var flag='add'

function marquee(){

if(left>=width){

flag='cut'

}

if(left<=0){

flag='add'

}

if(flag=='add'){

left+=2

}else if(flag=='cut'){

left-=2

}

var marqueeDiv=document.getElementById("marqueeDiv")

marqueeDiv.style.left=left+"px"

setTimeout("marquee()",10)

}

setTimeout("marquee()",100)

function showImg(obj){

obj.style.width="200px"

}

</script>

</body>

</html>

没有做onmouseleave和onmouseout事件。

<div class="upload-img-box" ref="moveWrap">

<div class="show-box" ref="rotate" @mousedown="moveImg" @mousewheel.prevent="rollImg($event,)">

<img :src="singleList.fileImgUrl" class="uploadimg" ref="img" :style="{transform:'scale('+multiples/100+') rotate('+rotate +'deg)'}"/>

</div>

<div class="img-plus" @click="toBIgChange()"><span class="tip">放大</span></div>

<div class="img-minus" @click="toSmallChange()"><span class="tip">缩小</span></div>

<div class="img-rotate" @click="toRotate()"><span class="tip">旋转</span></div>

</div>