(本文是慕课网课程文档整理,课程地址http://www.imooc.com/learn/80)
实现效果:
点击放大/减小按钮,图片进行相应的缩放,缩放到一定尺寸,不再缩放。(图片来自百度)
实现:
图片缓慢缩放,在一定程度上可以看做循环运行某段函数,因此,利用setInterval()定时器实现。
页面代码:
<span style="white-space:pre"> </span><div class = "content">
<img src = "test.jpg" id = "img">
<div>
<input type="button" id = "max" value = "放大">
<input type="button" id = "min" value = "减小">
</div>
<div>
居中利用margin:auto,但是不要忘了设置宽度。
js实现:
利用setInterval定时器来操作。
<!DOCTYPE html>
<html>
<head