需求是什么
需要实现一个图片放大缩小的功能，按住ctrl键滚动鼠标滚轮实现放大缩小，且以鼠标指针为中心实现放大缩小
如何实现
缩放
最外层container设置overflow:auto，同时container采用内层image的宽高。初始效果是img标签按照图片本身的宽高完全正常展开，img的父div才用img的宽高正好容纳img。
图片放大：给图片的宽高设置一个scale系数，但是外层div不变，所以div左侧和底侧出现scrollbar。但是此时图片是以div的左上角为基线来进行放大的。
关键逻辑
如果想要实现以鼠标指针为中心实现缩放，关键是在img宽高超过div宽高出现scrollbar后，通过设置scrollTop和scrollLeft来移动img在div中的相对位置，视觉上实现鼠标指针所指示的图片位置点没有移动，但是图片进行了缩放。
所以这里需要两个关键的数据就是鼠标的滚动事件和设置scrollTop、scrollLeft的值。
Element: wheel event
当滚动鼠标滚轮或操作其它类似输入设备时会触发滚轮事件。
滚轮事件实现了以下事件的属性： WheelEvent, MouseEvent, UIEvent and Event.
这里需要用到的是MouseEvent.offsetX和MouseEvent.offsetY
是指鼠标指针所在位置到元素边缘的相对X/Y坐标。
这里指的注意的是，虽然每次scale变化后，offestX和offsetY的值都会变化，但是offsetX/scrollHeight的值永远是scale的值。这里是用来计算得出scrollTop的关键。
遇到的问题
获取scrollTop