html图片在固定大小内自动缩小居中代码

<script language="JavaScript">
<!--
//按比例缩放
var flag=false;
function DrawImage(ImgD){
var image=new Image();
var iwidth = 180; //定义允许宽度
var iheight = 180; //定义允许高度
imagesrc=ImgDsrc;
if(imagewidth>0 && imageheight>0){
flag=true;
if(imagewidth/imageheight>= iwidth/iheight){
if(imagewidth>iwidth){
ImgDwidth=iwidth;
ImgDheight=(imageheightiwidth)/imagewidth;
}else{
ImgDwidth=imagewidth;
ImgDheight=imageheight;
}
ImgDalt=imagewidth+"×"+imageheight;
}
else{
if(imageheight>iheight){
ImgDheight=iheight;
ImgDwidth=(imagewidthiheight)/imageheight;
}else{
ImgDwidth=imagewidth;
ImgDheight=imageheight;
}
ImgDalt=imagewidth+"×"+imageheight;
}
}
}
//-->
</script>
<!---->
<div style="border:1px #000000 solid; width:180px;height:180px;text-align:center;">
<img src="" onload = "DrawImage(this)">
</div>

arcgis的htmld出窗口缩小方法如下。
1、首先打开软件，在软件中给制作的地图添加一个图框，可以看到图框大小，在界面左上角找到File选项并点击，在其下拉框中选择PageandPrintSetup选项。
2、界面上会d出一个PageandPrintSetup窗口，在窗口中找到UsePrinterPaperSettings选项，点击该选项，使其前面小方框中的勾消失即可。

使用javascript，根据你的设定设置img大小，这里有个例子：

function AutoResizeImage(maxWidth,maxHeight,objImg){
   var img = new Image();
   imgsrc = objImgsrc;
   var hRatio;
   var wRatio;
   var Ratio = 1;
   var w = imgwidth;
   var h = imgheight;
   if(w > maxWidth){  //判断宽度大于可视化的情况
    wRatio = maxWidth / w;
    hRatio = maxHeight / h;
    if (maxWidth ==0 && maxHeight==0){
    Ratio = 1;
    }else if (maxWidth==0){//
    if (hRatio<1) Ratio = hRatio;
    }else if (maxHeight==0){
    if (wRatio<1) Ratio = wRatio;
    }else if (wRatio<1 || hRatio<1){
    Ratio = (wRatio<=hRatiowRatio:hRatio);
    }
    if (Ratio<1){
    w = w  Ratio;
    h = h  Ratio;
    }
    objImgheight = h;
    objImgwidth = w;
   }
   }

以上是js的方法

下面这个是引用的img
<img id="lc_div" src="路径"  onload="AutoResizeImage(500,500,this)" />

---

我想做出这个网页放大缩小的效果 >

欢迎分享，转载请注明来源：内存溢出

原文地址:https://54852.com/yw/10551082.html