1、 简单控制图片width,height的例子
<script language="javascript" type="text/javascript">
function forBig(id)
{
var node = document.getElementById(id);
var width = node.getAttribute("width");
var height = node.getAttribute("height");
node.setAttribute("width",width+20);
node.setAttribute("height",height+20);
}
function forSmall(id)
{
var node = document.getElementById(id);
var width = node.getAttribute("width");
var height = node.getAttribute("height");
node.setAttribute("width",width-10);
node.setAttribute("height",height-10);
}
</script>
简单控制图片width,height的例子//图片路径楼主把握一下
<script language="javascript" type="text/javascript">
function enlarge(id)
{
var node = document.getElementById(id);
var width = node.getAttribute("width");
var height = node.getAttribute("height");
node.setAttribute("width",width+20);
node.setAttribute("height",height+20);
}
function shrink(id)
{
var node = document.getElementById(id);
var width = node.getAttribute("width");
var height = node.getAttribute("height");
node.setAttribute("width",width-10);
node.setAttribute("height",height-10);
}
</script>
</HEAD>
-----------------------
<BODY>
<button onclick="enlarge('image');return true;">放大</button><button onclick="shrink('image');return true;">缩小</button><br/><br/>
<img id="image" src="./image/image1.gif"><!--//换成你的图片路径-->
</BODY>
</HTML>
这样能勉强实现图片放大和缩小功能,但图片会失真。
还有一种就是显示不同的图片,来实现放大缩小的功能。就是点击放大按钮后就换一张同样内容的大图,点击缩小按钮换上一张同样内容的小图。这样实现不好的地方在于只有两个大小。
2、将图片存进数据库后,再取出来显示到jsp页面中
byte[] imageBytes = ............//从数据库里取出图片
OutputStream out = response.getOutputStream();
out.write(imageBytes);
out.flush();
out.close();
这段代码就可以将图片输出到jsp页面上。