不刷新,点击上传图片,传完图片后,这个页面即刻显示图片?

本文介绍了一种使用JavaScript实现图片缩放的方法,并提供了具体的代码示例。通过调整图片的高度和宽度来适应不同的显示需求。
<input   type="file"   onchange="show.src=this.value"   name="img">  
  <img   id="show"/>

顯示後還要形成縮略圖:
js:
None.gif function  setImgSize(imgID,maxWidth,maxHeight)
ExpandedBlockStart.gifContractedBlock.gif
dot.gif {
InBlock.gif    
var img = document.images[imgID];
InBlock.gif    
if(maxWidth < 1)
ExpandedSubBlockStart.gifContractedSubBlock.gif    
dot.gif{
InBlock.gif        
if(img.height > maxHeight)
ExpandedSubBlockStart.gifContractedSubBlock.gif        
dot.gif{
InBlock.gif            img.height 
= maxHeight;
ExpandedSubBlockEnd.gif        }

InBlock.gif        
return true;
ExpandedSubBlockEnd.gif    }

InBlock.gif    
if(maxHeight < 1)
ExpandedSubBlockStart.gifContractedSubBlock.gif    
dot.gif{
InBlock.gif        
if(img.width > maxWidth)
ExpandedSubBlockStart.gifContractedSubBlock.gif        
dot.gif{
InBlock.gif            img.width 
= maxWidth;
ExpandedSubBlockEnd.gif        }

InBlock.gif        
return true;
ExpandedSubBlockEnd.gif    }

InBlock.gif    
if(img.height > maxHeight || img.width > maxWidth)
ExpandedSubBlockStart.gifContractedSubBlock.gif    
dot.gif{
InBlock.gif        
if((img.height / maxHeight) > (img.width / maxWidth))
ExpandedSubBlockStart.gifContractedSubBlock.gif        
dot.gif{
InBlock.gif            img.height 
= maxHeight;
ExpandedSubBlockEnd.gif        }

InBlock.gif        
else
ExpandedSubBlockStart.gifContractedSubBlock.gif        
dot.gif{
InBlock.gif            img.width 
= maxWidth;
ExpandedSubBlockEnd.gif        }

InBlock.gif        
return true;
ExpandedSubBlockEnd.gif    }

ExpandedBlockEnd.gif}


調用:
<script language="javascript" type="text/javascript" src="setImgSize.js"></script>
<img alt="" id="img1" onload="setImgSize('img1',150,0);" src=" http://img.poco.cn/photo/20060602/972374149620060602140117_1.jpg" />

转载于:https://www.cnblogs.com/Nina-piaoye/archive/2006/11/07/552946.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值