Programming Challenges in Javascript for kids

Programming Challenges in Javascript for kids
0.0 0

#1

I am wondering how to do a repetitive loop. The end goal is to have Hello World travel in a square around the page. Here is what I have so far. Anything suggestions would be appreciated.

<script>
        var leftOffset = 0;
        var topOffset = (200, 20);
        var rightOffset = 200;
        var toTheTop = (0, 200);
        var again = 0;


        var moveHeading = function() {
            $('#heading').offset({
                top:0,
                left: leftOffset
            });
            leftOffset++;


            if (leftOffset > 200) {
                $('#heading').offset({
                    left: 200,
                    top: topOffset
                });
                topOffset++;
            };
            if (topOffset > 200) {
                $('#heading').offset({
                    top: 200,
                    left: rightOffset
                });
                rightOffset--;
            };
       

            if (rightOffset < 0) {
                $('#heading').offset({
                    left: (200, 0),
                    top: toTheTop
                });
                toTheTop--;
  
            };
            if(toTheTop < 0) {
               
                $('#heading').offset({
                top:0,
                left: 0
            });
            again++;
                moveHeading();

            };

        };


    var name = setInterval(moveHeading,7);