js 的 3D

最新推荐文章于 2024-07-07 11:31:22 发布

奋斗的小小骚年

最新推荐文章于 2024-07-07 11:31:22 发布

阅读量348

点赞数

分类专栏： JavaScript

本文链接：https://blog.csdn.net/qq_41654985/article/details/79764388

版权

JavaScript 专栏收录该内容

33 篇文章 1 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<script>
    var img=new Image()
    img.addEventListener("load",loadHandler)
    img.src="img/golf0.jpg";
    var sum=0;
    img.addEventListener("mousedown",mouseHandler)

    function mouseHandler(e) {
        e.preventDefault();
        if (e.type === "mousedown") {
            img.addEventListener("mouseup", mouseHandler);
            img.addEventListener("mousemove", mouseHandler);
        } else if (e.type === "mouseup") {
            img.removeEventListener("mouseup", mouseHandler);
            img.removeEventListener("mousemove", mouseHandler)
        }else if(e.type==="mousemove"){
            var s=Math.ceil(e.movementX/3);//movement 点击然后向左为负，反之为正
            sum+=s;
            if(sum<0){
                sum=71;
            }
            if(sum>71){
                sum=0
            }
            img.src="img/golf"+sum+".jpg";
            console.log(img.src)
        }
    }
    function loadHandler(e) {
        document.body.appendChild(img)
    }
</script>
</body>
</html>