README
drag-img
移动端旋转、缩放、移动图片组件(仅支持移动端)
安装
npm install drag-img -S
使用
- 直接引用
/* 旋转按钮图片 */
.dragRotateScale_move .dragRotateScale_rotate {
background-image: url('../../static/b.jpg');
}
/* 关闭按钮图片 */
.dragRotateScale_move .dragRotateScale_close {
background-image: url('../../static/b.jpg');
}
<script type="text/javascript" src="./dragRotateScale.js"></script>
let preImg2 = document.getElementById('preImg2')
new dragRotateScale(preImg2, {
...
})
- npm
/* 旋转按钮图片 */
.dragRotateScale_move .dragRotateScale_rotate {
background-image: url('../../static/b.jpg');
}
/* 关闭按钮图片 */
.dragRotateScale_move .dragRotateScale_close {
background-image: url('../../static/b.jpg');
}
import dragrotatescale from 'drag-img'
new dragrotatescale(preImg2, {
src: img, //要拖动的图片地址
rotateButton: 30, // 按钮的宽高
imgScaleMax: 10, //缩放限制
imgScaleMin: 0.1,
rotateStart() { //钩子
console.log('rotateStart')
},
rotateMove(o) {
console.log('rotateMove', o)
},
imgStart() {
console.log('imgStart')
},
imgMove() {
console.log('imgMove')
},
imgEnd() {
console.log('imgEnd')
},
imgClose() {
console.log('imgClose')
}
})