图片等比缩小
JavaScript
HTML
1 <script type="text/javascript">
2 function reduceImage(obj, MAX_WIDTH, MAX_HEIGHT, IMG_MARGIN){
3 var IMG = new Image();
4 IMG.src = obj.src;
5 IMG.onload = function (){
6 var w = IMG.width;
7 var h = IMG.height;
8 if(w > MAX_WIDTH || h > MAX_HEIGHT){
9 if(w > MAX_WIDTH){
10 obj.style.width = MAX_WIDTH + 'px';
11 obj.style.height = IMG.height * MAX_WIDTH / IMG.width + 'px';
12 var h2 = parseInt(obj.style.height);
13 if(h2 > MAX_HEIGHT){
14 obj.style.height = MAX_HEIGHT + 'px';
15 obj.style.width = parseInt(obj.style.width) * MAX_HEIGHT / h2 + 'px';
16 }
17 }else{
18 obj.style.height = MAX_HEIGHT + 'px';
19 obj.style.width = IMG.width * MAX_HEIGHT / IMG.height + 'px';
20 var w2 = parseInt(obj.style.width);
21 if(w2 > MAX_WIDTH){
22 obj.style.width = MAX_WIDTH + 'px';
23 obj.style.height = parseInt(obj.style.height) * MAX_WIDTH / w2 + 'px';
24 }
25 }
26 }
27 obj.style.marginLeft = IMG_MARGIN + (MAX_WIDTH - obj.width) / 2 + 'px';
28 obj.style.marginTop = IMG_MARGIN + (MAX_HEIGHT - obj.height) / 2 + 'px';
29 }
30 IMG.src = obj.src;
31 }
32 </script>
2 function reduceImage(obj, MAX_WIDTH, MAX_HEIGHT, IMG_MARGIN){
3 var IMG = new Image();
4 IMG.src = obj.src;
5 IMG.onload = function (){
6 var w = IMG.width;
7 var h = IMG.height;
8 if(w > MAX_WIDTH || h > MAX_HEIGHT){
9 if(w > MAX_WIDTH){
10 obj.style.width = MAX_WIDTH + 'px';
11 obj.style.height = IMG.height * MAX_WIDTH / IMG.width + 'px';
12 var h2 = parseInt(obj.style.height);
13 if(h2 > MAX_HEIGHT){
14 obj.style.height = MAX_HEIGHT + 'px';
15 obj.style.width = parseInt(obj.style.width) * MAX_HEIGHT / h2 + 'px';
16 }
17 }else{
18 obj.style.height = MAX_HEIGHT + 'px';
19 obj.style.width = IMG.width * MAX_HEIGHT / IMG.height + 'px';
20 var w2 = parseInt(obj.style.width);
21 if(w2 > MAX_WIDTH){
22 obj.style.width = MAX_WIDTH + 'px';
23 obj.style.height = parseInt(obj.style.height) * MAX_WIDTH / w2 + 'px';
24 }
25 }
26 }
27 obj.style.marginLeft = IMG_MARGIN + (MAX_WIDTH - obj.width) / 2 + 'px';
28 obj.style.marginTop = IMG_MARGIN + (MAX_HEIGHT - obj.height) / 2 + 'px';
29 }
30 IMG.src = obj.src;
31 }
32 </script>
<img src="images/01.jpg" alt="" onload="javascript:reduceImage(this,100,80,0);" />
浙公网安备 33010602011771号