<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
</head>
<body>
<?php
<script type="text/javascript">
var zoomLevel = 0;
var originalWidth = 0;
var originalHeight = 0;
var maxWidth = 680;//宽度最大值
var maxHeight = 11100;//高度最大值
function initial()
{
originalWidth = document.myImage.width;
originalHeight = document.myImage.height;
alert(originalWidth+'aa'+originalHeight);
maxWidth = originalWidth > maxWidth ? maxWidth : originalWidth;
maxHeight = originalHeight > maxHeight ? maxHeight : originalHeight;
if((originalHeight/originalWidth)*maxWidth > maxHeight)
{
maxWidth = ( originalWidth / originalHeight)*maxHeight;
}
maxWidth = Math.ceil(maxWidth);
updateImg();
}
function zoomIn()
{
zoomLevel++;
updateImg(1);
//update();
}
function zoomOut(){
zoomLevel--;
updateImg(0);
//update();
}
function updateImg(type)
{
if( type == 0)
{//缩小
while( true)
{//请弄个表较大的图片测试(w:1024的)
var leval = Math.pow(2, zoomLevel);
alert(leval);//请将此行注释
if( originalWidth*leval > document.myImage.width)
{
zoomLevel--;
}
else
{
break;
}
}
}
else
{
var leval = Math.pow(2, zoomLevel);
}
if(originalWidth*leval <= maxWidth)
{
document.myImage.width = originalWidth*leval;
document.myImage.height = originalHeight*leval;
}
else
{
document.myImage.width = maxWidth;
document.myImage.height = (originalHeight/originalWidth)*maxWidth;
}
document.getElementById('currentWidth').value = document.myImage.width ;
document.getElementById('currentHeight').value = document.myImage.height ;
}
function resetImage()
{
document.myImage.width = maxWidth;
document.myImage.height = (originalHeight/originalWidth)*maxWidth;
zoomLevel = 0;
updateImg(1);
}
</script>
<body onload="initial()">
<form name="form1">
<img name="myImage" src="1.jpg">
<br>
<input type="button" value="放大图片" onclick="zoomIn()">
<input type="button" value="缩小图片" onclick="zoomOut()">
<input type="button" value="重置图片" onclick="resetImage()">
缩放：<span id="zoomsize"></span> - 图片尺寸：<span id="imgsize"></span>
<input type="text" id="currentWidth" name="currentWidth" >
<input type="text" id="currentHeight" name="currentHeight" >
?>
</body>
</html>
http://www.wujianrong.com/mt-tb.cgi/5835