商品图片缓慢放大效果图的代码_javascript中原图是400*400px的,改过后,原图改变大小,放大效果不改怎么办-优快云博客

本文链接：https://blog.youkuaiyun.com/mengqiuqiuq/article/details/12145845

本文介绍了一种交互式图片展示方法，通过鼠标操作实现图片的平移、缩放及预览功能，提供了用户友好的图片浏览体验。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">

</style>
<script type="text/javascript">
var timer;
function setmouse(e){
var o1=document.getElementById("div1");
var imgs=o1.getElementsByTagName("img");
for(var i=0;i<imgs.length;i++){
  imgs[i].οnmοusemοve=function(){
   xy(e);
   }
   imgs[i].οnmοuseοver=function(){
   fangda(this);
   }
   imgs[i].οnmοuseοut=out;
  }
}
function xy(e){
var mx,my;
mx=showPos(e).x;
my=showPos(e).y;
document.getElementById("mx").value=mx;
document.getElementById("my").value=my;
var o1,o2;
o1=document.getElementById("div1");
o2=document.getElementById("divsh");
o2.style.left=showPos(e).x-parseInt(o1.offsetLeft)+5+"px";
o2.style.top=showPos(e).y-parseInt(o1.offsetTop)+5+"px";

}
function showPos(e){
e=e||window.event;
var x,y;
  return{
  x:e.clientX+document.body.scrollLeft+document.documentElement.scrollLeft,
  y:e.clientY+document.body.scrollTop+document.documentElement.scrollTop
}
}