jQuery+css使用按钮功能更改图片大小
时间: 2023-07-30 14:07:01 浏览: 131
jQuery+CSS图片浮动层效果.zip_jQuery+CSS图片浮动层效果
可以通过jQuery和CSS实现按钮功能来更改图片大小。具体步骤如下:
1. 在HTML中添加一个按钮和一个图片元素:
```
<button id="resize-btn">点击调整图片大小</button>
<img id="my-image" src="image.jpg" alt="My Image">
```
2. 在CSS中设置图片的初始大小:
```
#my-image {
width: 200px;
height: 200px;
}
```
3. 使用jQuery绑定按钮的点击事件,并在回调函数中更改图片的大小:
```
$('#resize-btn').click(function() {
$('#my-image').css({
'width': '300px',
'height': '300px'
});
});
```
这将在点击按钮时将图片的宽度和高度更改为300像素。您可以根据需要调整这些值。
阅读全文