You sit at your computer, ready to learn coding on CodeHS. You reach exercise 9.7.4, called Leash. At first, it looks tricky. You need to make a ball follow your mouse like a dog on a leash. The Leash stays tied to the middle of the screen. You try a few lines of code, but the ball does not move right, or the line vanishes. Sound familiar? Many beginners face this. But you can fix it. This article shows you how to get the 9.7.4 leash CodeHS answers step by step. We use easy words and clear examples so anyone can follow.
CodeHS teaches coding in small steps. This exercise sits in the Animation and Games section. It helps you practice drawing shapes and handling mouse moves. Think of it like walking a dog in a park. The dog runs to where you point, but the Leash keeps it from going too far. Here, the “dog” is a ball, and the “leash” is a line. But in this version, the Leash stretches as far as you move the mouse. Later exercises might add limits, but this one keeps it basic.
Understand the Task First
Before you type code, know what the program must do. The screen starts with a line and a ball in the centre. When you move the mouse, the line stretches from the centre to the mouse spot. The ball moves to the end of the line, right under the mouse. It happens smoothly and fast every time the mouse shifts.
Why does this matter? In real life, games use this idea. For example, in a fishing game, the line from your rod follows the fish. Or in a puzzle app, you drag items tied to a point. Learning this helps you build fun programs later. CodeHS scores this exercise with 5 points. Get it right, and you move forward with confidence.
Many students search for 9.7.4 Leash CodeHS answers because they miss small details. Maybe the ball shows up wrong, or the line flickers. We cover those issues here.
Set Up Your Code Environment
Open CodeHS and go to the exercise. You work in JavaScript. CodeHS has a built-in canvas for drawing. It gives you tools like Circle and Line to make shapes.
Start with variables. These hold your ball and line. Use a constant for the ball size. Call it BALL_RADIUS and set it to 30. That makes the ball easy to see.
Next, create the line. It starts at the centre. Use getWidth() / 2 for the middle across, and getHeight() / 2 for the middle down. So, the line begins and ends at that spot at first.
Then, make the ball. Use new Circle(BALL_RADIUS).
This setup acts like preparing your tools before building a model. You gather pieces first.
Build the Starting Scene
CodeHS runs a function called start() when the program begins. Put your setup there.
Create a function to place the ball. Name it something simple, like placeBall. Inside it, set the ball position to the centre. Give it a colour, say yellow, so it stands out. Then add it to the canvas with add(ball).
Call placeBall() inside start().
Why a separate function? It keeps code clean. If you need to reset later, youcan call it again.
In real-world coding, apps start with a menu screen. This is like that—set the scene before action.
Make It Move with the Mouse
Now comes the fun part. You need the line and ball to follow the mouse.
CodeHS has mouseMoveMethod. It takes a function name. Every time the mouse moves, that function runs.
Create a function called followMouse. It gets an event, e, with mouse info.
Inside, change the line end to e.getX() and e.getY(). Use setEndpoint for that.
Then, move the ball to the same spot with setPosition.
Add the line to the canvas. But add it only once, or it might flicker.
In start(), after placing the ball, call mouseMoveMethod(followMouse).
Test it. Move the mouse. The line stretches, and the ball follows.
If it does not work, check if you added the line. Sometimes students forget that.
This mirrors how touch screens work on phones. You drag icons, and they follow your finger.
Put It All Together: The Full Code
Here is the code that works for 9.7.4 leash CodeHS answers. Copy it carefully.
var BALL_RADIUS = 30;
var line = new Line(getWidth() / 2, getHeight() / 2, getWidth() / 2, getHeight() / 2);
var ball = new Circle(BALL_RADIUS);
function placeBall() {ball.setPosition(getWidth() / 2, getHeight() / 2);
ball.setColor(Color.yellow); add(ball);}
function followMouse(e) {
line.setEndpoint(e.getX(), e.getY());
ball.setPosition(e.getX(), e.getY());
add(line);}
function start() {placeBall();
mouseMoveMethod(followMouse);}
This code starts everything right. The line and ball update with each mouse move.
Why yellow? CodeHS often uses bright colours in examples. You can change it, but yellow passes the test.
Fix Common Mistakes
Even with good code, errors happen. Here are fixes forthe usual problems.
First, if the Leash disappears when you move, you might remove and remake the line each time. Do not do that. Update the endpoint instead.
Second, if the ball starts off-centre, check the start(). Make sure you set the position there.
Third, multiple lines appear? That means you add a new line each move. Add it only once, maybe at the start.
Fourth, no movement? Ensure mouseMoveMethod points to your function.
Fifth, wrong size or colour? Match the radius to 30 and use a visible colour.
Print mouse spots with println(e.getX()) to check.
These tips come from students who struggled. Fix them, and you pass.
In everyday coding, games crash from small bugs. Learning to fix helps.
Tips to Make It Better
Once it works, improve it. Add a max length to the Leash. Calculate the distance from the centre to the mouse. If to far, stop the ball at the limit.
Use Math.sqrt and Math.pow for distance.
This turns it into a real leash, like tying a dog to a post.
Practice with similar exercises. Do the drawing lines quiz before this.
Watch CodeHS videos on mouse events. They explain e.getX().
Join forums. Ask questions if stuck. But try first— it builds skills.
Code with friends. One spots errors, the other misses.
Rest between sessions. Tired eyes miss code lines.
These habits help beyond this exercise.
Why Learn This in Coding
Coding teaches problem-solving. This exercise shows how to link user actions to screen changes.
In jobs, web developers use mouse events for menus. Game makers use them for controls.
Even non-coders benefit. It trains logical thinking, like planning a trip step by step.
CodeHS builds from the basics to games. Master 9.7.4 leash CodeHS answers, and harder ones get easier.
Think of apps you use. Maps zoom with the mouse. This is the start of that.
A Student’s Story: From Stuck to Success
Meet Alex, a new coder. Alex opens 9.7.4 Leash and types random lines. The ball sits still. Frustrated, Alex searches for help.
Alex finds steps like these. Sets variables, builds start(), adds mouse function. Test bit by bit.
Soon, the ball follows. Alex adds a sound effect for fun.
Now Alex helps others. You can too.
Stories like this show that anyone learns with patience.
Next Steps After Solving
Done with this? Try Crazy Ball Game next. It adds bounces.
Review old exercises. Strong basics help.
Build your project. Make a drawing app with lines.
Share code online. Get feedback.
Keep coding daily. Short sessions add up.
You now have the tools for 9.7.4 leash CodeHS answers. Use them well.
Coding opens doors. Start simple, grow big.
Read also: Taylor Crawford White County High School: Complete Overview
