美文网首页
图片旋转预览

图片旋转预览

作者: welcomeHere | 来源:发表于2017-10-18 10:03 被阅读0次

1.dom

<div>
    <div class="rotate-icon">
        ![](/src/assets/image/rotate_r.png)
        ![](/src/assets/image/rotate_r.png)
    </div>
    <div>
        ```
            ![](filePath)
        ```
        ![](filePath)
    </div>
</div>

2.js

引入jquery旋转插件
<script src="/src/assets/js/jquery.rotate.js"></script>
// 旋转图片
rotateImg(type) {
    let rot = this.rot;
    if (type == "left") {
        if (rot === -360) {
            rot = 0;
        }
        rot -= 90;
        $("#rotImg").rotate(-90);
    }
    if (type == "right") {
        if (rot === 360) {
            rot = 0;
        }
        rot += 90;
        $("#rotImg").rotate(90);
    }
    this.rot = rot;
},

相关文章

网友评论

      本文标题:图片旋转预览

      本文链接:https://www.haomeiwen.com/subject/yoeqjxtx.html