如何使用 JavaScript 增加和减小图像大小
答案：使用 JavaScript width 和 height 属性
您可以使用 width 或 height JavaScript 属性来按比例增加和减少图像的尺寸，例如放大和缩小功能。
让我们看一下以下示例，以了解其基本工作原理：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>JavaScript Increasing and Decreasing Image Size</title>
<script>
function zoomin(){
var myImg = document.getElementById("sky");
var currWidth = myImg.clientWidth;
if(currWidth == 500){
alert("Maximum zoom-in level reached.");
} else{
myImg.style.width = (currWidth + 50) + "px";
}
}
function zoomout(){
var myImg = document.getElementById("sky");
var currWidth = myImg.clientWidth;
if(currWidth == 50){
alert("Maximum zoom-out level reached.");
} else{
myImg.style.width = (currWidth - 50) + "px";
}
}
</script>
</head>
<body>
<p>
<button type="button" onclick="zoomin()">Zoom In</button>
<button type="button" onclick="zoomout()">Zoom Out</button>
</p>
<img src="sky.jpg" id="sky" width="250" alt="Cloudy Sky">
</body>
</html>FAQ 相关问题解答
以下是与此主题相关的更多常见问题解答：
Advertisements