PageAdmin网站内容管理系统(CMS)交流论坛

注册

 

QQ登录

只需一步,快速开始

发新话题 回复该主题

关于产品图片自动放大的问题有代码 [复制链接]

1#
求助,,鼠标放在产品图片上面就自动放大,当吧鼠标移走就自动还原到原来大小怎么完成,,附上代码
<IMG id="IMG1" src="/image/upload/product/2009-09/11162712.jpg/" border="1" width="88" height="80"   >
<script language="javascript">
  
  var img_height=200;//此值可该;设定图变到的最大高度
  var img_width=200;//此值可改;设定图变到的最大宽度(与高度img_height相比谁先达到谁的值为准!汗,不会表达!)
  var k=10;        //图一次变大的值,此值越大,图变大的越快
  var timer1=10;  //图多长时间变化一次,值些小,变化越快
  var sh;
  var oldWidth=parseInt(document.all["IMG1"].width);//读取图像的宽度,并转化为整数型
  var oldHeight=parseInt(document.all["IMG1"].height);//读取图像的宽度,并转化为整数型
function  timer(){
if (document.all["IMG1"].width<img_width){
  sh=setInterval("image_test()",timer1);
}
}
  function  timer2(){
  if (document.all["IMG1"].width>oldWidth){
  sh=setInterval("image_def()",timer1);
}
}
function image_test(){
  var j=oldWidth/oldHeight;
  document.all["IMG1"].width=document.all["IMG1"].width+j*k ;
  document.all["IMG1"].height=document.all["IMG1"].height+k;
  
  if (document.all["IMG1"].height>=img_height||document.all["IMG1"].width>=img_width){
   clearInterval(sh)
  }
}
  function image_def(){
  var j=oldWidth/oldHeight;
  document.all["IMG1"].width=document.all["IMG1"].width-j*k ;
  document.all["IMG1"].height=document.all["IMG1"].height-k;
  
  if (document.all["IMG1"].height<=oldHeight||document.all["IMG1"].width<=oldWidth){
   clearInterval(sh)
  }
}
function reset(){//图像大小初始化
   document.all["IMG1"].width=oldWidth;
   document.all["IMG1"].height=oldHeight;
   clearTimeout(sh);
}
</script>
分享 转发
TOP
2#

我想达到的效果是产品展示里面所有的图片都能有这样的效果
TOP
发新话题 回复该主题