JavaScript动画将无法按预期执行

我正试图开始制作一个游戏，在为斯蒂克曼的腿编写动画的同时，动画的腿似乎出现了故障，当我启动程序时，只是从a点转到b点。我想不出是怎么回事。这是我的密码

var grassY = 370;
var bodyX = 200;
var ham1X = 220;
var ham1Y = 350;
var ham2X = 185;
var ham2Y = 350;
var foot1X = 230;
var foot1Y = 365;
var foot2X = 165;
var foot2Y = 340;
var bodyhigh = 315;
var bodylow = 340;

fill(4, 255, 0);
rect(-1,grassY,401,31);



draw = function() {
    var cn = 2;
    var bcn = 0;
    background(255, 255, 255);
    fill(4, 255, 0);
    rect(-1,grassY,401,31);
    line(bodyX,bodylow,bodyX,bodyhigh);
    line(bodyX,bodylow,ham1X,ham1Y);
    line(ham1X,ham1Y,foot1X,foot1Y);
    line(bodyX,bodylow,ham2X,ham2Y);
    line(ham2X,ham2Y,foot2X,foot2Y);

    if(bcn === 0){
        if(cn===2){
            ham1X -= 0.5;//-5
            ham1Y += 0.5;//+5
            ham2X += 1;//+10
            ham2Y += 0.5;//+5
            foot1X -= 2.5;//-25
            foot1Y = 365;//0
            foot2X -= 1.5;//-15
            foot2Y += 0.5;//+5
        }
        if(ham1X <= 215){
            ham1X = 215;//-5
            ham1Y = 355;//+5
            ham2X = 195;//10
            ham2Y = 355;//+5
            foot1X = 205;//-25
            foot1Y = 365;//0
            foot2X = 180;//-15
            foot2Y = 350;//+5
            cn = 11;
        }
        if(cn === 11){
            ham1X -= 3;//-30
            ham1Y -= 0.5;//-5
            ham2X += 2.5;//+25
            ham2Y -= 0.5;//-5
            foot1X -= 4;//-40
            foot1Y -= 2.5;//-25
            foot2X += 5;//+50
            foot2Y += 1.5;//+15
        }
    }
    if(ham1X <= 185){

        cn = 3;
        bcn = 1;
    }
    if(cn === 3){
        ham1X += 3;//-30
        ham1Y += 0.5;//-5
        ham2X -= 2.5;//+25
        ham2Y += 0.5;//-5
        foot1X += 4;//-40
        foot1Y += 2.5;//-25
        foot2X -= 5;//+50
        foot2Y -= 1.5;//+15
        cn = 4;
    }
    if(ham1X >= 215){
        ham1X = 215;//-5
        ham1Y = 355;//+5
        ham2X = 195;//10
        ham2Y = 355;//+5
        foot1X = 205;//-25
        foot1Y = 365;//0
        foot2X = 180;//-15
        foot2Y = 350;//+5
        cn = 5;
    }
    if(cn === 5){
        ham1X += 0.5;//-5
        ham1Y -= 0.5;//+5
        ham2X -= 1;//+10
        ham2Y -= 0.5;//+5
        foot1X += 2.5;//-25
        foot1Y = 365;//0
        foot2X += 1.5;//-15
        foot2Y -= 0.5;//+5
    }
    if(ham1X >= 220){
        cn = 2;
        bcn = 0;
    }

};

var grassY=370；
var bodyX=200；
var-ham1X=220；
var ham1Y=350；
var ham2X=185；
var-ham2Y=350；
var foot1X=230；
var foot1Y=365；
var foot2X=165；
var foot2Y=340；
var bodyhigh=315；
var bodylow=340；
填充（42550）；
rect（-1，草状，401,31）；
draw=函数（）{
var cn=2；
var-bcn=0；
背景（255、255、255）；
填充（42550）；
rect（-1，草状，401,31）；
线路（bodyX、bodylow、bodyX、bodyhigh）；
线路（bodyX、bodylow、ham1X、ham1Y）；
线（ham1X，ham1Y，foot1X，foot1Y）；
线（bodyX、bodylow、ham2X、ham2Y）；
线（ham2X，ham2Y，foot2X，foot2Y）；
如果（bcn==0）{
如果（cn==2）{
ham1X-=0.5；//-5
ham1Y+=0.5；//+5
ham2X+=1；//+10
ham2Y+=0.5；//+5
英尺1X-=2.5；//-25
foot1Y=365；//0
英尺2x-=1.5；//-15
英尺2y+=0.5；//+5
}
如果（ham1X=220）{
cn=2；
bcn=0；
}
};

这是Processing.js还是P5.js？无论哪种方式，请尝试提供我们可以运行的。您的

setup（）

函数在哪里

堆栈溢出并不是为一般的“我不知道为什么这100行代码不起作用”类型的问题而设计的。它是为特定的“我以为这行代码做了ABC，但它做了XYZ”类型的问题而设计的

为了帮助你做到这一点，你需要养成分块工作的习惯。看起来你曾经尝试过一次编写整个动画，这只会让你陷入这样的情况，它不起作用，你也不知道为什么。相反，一次只做一小块：你能让一条线穿过电子屏幕？使其完美运行，然后添加另一行，与第一行一起移动。然后您可以发布更具体的问题。推荐阅读：

话虽如此，下一步你需要做的就是调试你的程序。我首先要在每个

if

语句中添加

console.log（）

语句

---

这将告诉你，你的代码总是输入

if（ham1X），请再次阅读你自己的问题-你明白吗？请阅读并比你的问题创建一个新的答案。