为了账号安全,请及时绑定邮箱和手机立即绑定

js如何实现鼠标拖拽旋转功能

js如何实现鼠标拖拽旋转功能

动漫人物 2018-09-07 14:13:39
js如何实现鼠标拖拽旋转功能,目前我已做成鼠标拖放功能,想加个旋转不知道该怎么做啦,效果类似美图秀秀app上的图片旋转功能
查看完整描述

1 回答

?
弑天下

TA贡献1818条经验 获得超8个赞

<!DOCTYPE html>

<html>

<head>

<style> 

div

{

width:100px;

height:100px;

background:red;

position:relative;

}

</style>


<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>

<script type="text/javascript">

    $(function(){

        var oldY= null;

        var isdown = false;

        $("#testcss").mousedown(function(e){

            isdown = true;

            oldY = e.clientY;

        });

        $("html").mousemove(function(e){

            if(isdown){

                $("#testcss").css("transform","rotate("+(e.clientY-oldY)+"deg)");

            }

        });

        $("html").mouseup(function(e){

            isdown = false;

            oldY = null;

        });

    });

</script>

</head>

<body>

    <div id="testcss"></div>

</body>

</html>


查看完整回答
反对 回复 2018-10-27
  • 1 回答
  • 0 关注
  • 1981 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信