多语言展示
当前在线:1844今日阅读:60今日分享:41

js 元素大小缩放实例

元素大小缩放是一套连贯事件,按下鼠标不放,拖动鼠标 然后松开。
工具/原料
1

源码:https://pan.baidu.com/s/1f4n0NK6QzFnQokMSWf7kEg

2

样本:http://js.zhuamimi.cn/%E5%85%83%E7%B4%A0%E5%A4%A7%E5%B0%8F%E8%B0%83%E6%95%B4/

方法/步骤
1

按下鼠标事件当按下鼠标时,记录元素大小、鼠标按下的位置、状态位。

2

拖动鼠标事件当鼠标拖动时,计算元素调用后的大小。 元素调整后大小 =  初始元素大小 + (鼠标移动位置 - 鼠标按下位置)

3

鼠标松开事件当调整完成后,鼠标松开这时重置状态位,防止移动鼠标时触发移动事件。

推荐信息