JS奇技之利用奇技之利用scroll来监听来监听resize详解详解
前言前言
大家都知道知道原生的 resize 事件只能作用于 defaultView 即 window 上，那么我们应该通过什么样的方式来监听其他元素的
大小改变呢？笔者最近学习发现了一种神奇的方法，通过 scroll 事件来间接实现 resize 事件的监听，本文将对这种方式进行
原理的剖析与代码实现。
原理原理
首先，我们先来看一下 scroll 事件是干嘛的。
The scroll event is fired when the document view or an element has been scrolled.
当文档视图或者元素滚动的时候会触发 scroll 事件。
也就是说元素滚动的时候会触发这个事件，那么什么时候元素会滚动？当元素大于其父级元素，且父级元素允许其滚动的时
候，该元素可以进行滚动。换句话说，元素可以滚动意味着父子元素大小不一致，这是这个方法的核心。
那么我们需要让元素大小发生改变时，使得 scrollLeft 或者 scrollTop 发生改变，从而触发 scroll 事件，进一步得知其大小发生
了改变。
监听元素变大监听元素变大
元素变大的时候，我们可以看到更多，其内部可滚动区域将慢慢减小，但这并不会造成滚动条位置的改变，但当元素大到让滚
动条消失的时候会让 scrollLeft 或者 scrollTop 变成 0，这样我们就知道了元素变大了，因此我们其实只需要 1px 来判断，其图
示如下：
监听元素变小监听元素变小
当元素变小的时候，可滚动区域会变大，滚动条的位置其实并不会进行改变，这里采取的做法是，让可滚动区域和父元素成一
定的比例一起缩小，让父元素来挤压滚动区域，从而间接改变滚动条 scrollLeft 或者 scrollTop 的大小，文字描述可能不是很
清楚，我们看下图：
资源评论
