draw = function() {
fill(0, 255, 68); // start color
if (mouseIsPressed&&mouseX>50&&mouseX>250&&mouseY<150&&mouseX<400) {
fill(33, 112, 52); // click color
}
rect(50, 150, 250, 100); // the button
// The button text
fill(0, 0, 0);
textSize(30);
text("PRESS ME!", 93, 193);
};
what's wrong with my code
There are a couple of issues with your code:
1. In the if statement condition, you have `mouseX>250` twice instead of using `mouseY` for the second condition. It should be `mouseY<150` instead of `mouseX>250`.
2. In the fill function for the button click color, you have `33, 112, 52` instead of `0, 112, 52`. It should be `fill(0, 112, 52)` for the click color.
After making these changes, your code should work as expected.
In your code, there is a logical error in the conditional statement for checking if the mouse is pressed in the correct position. Here is the corrected code:
```javascript
draw = function() {
fill(0, 255, 68); // start color
if (mouseIsPressed && mouseX > 50 && mouseX < 400 && mouseY > 150 && mouseY < 250) {
fill(33, 112, 52); // click color
}
rect(50, 150, 250, 100); // the button
// The button text
fill(0, 0, 0);
textSize(30);
text("PRESS ME!", 93, 193);
};
```
In the corrected code, the condition `mouseX > 250` has been changed to `mouseX < 400` as you intended to check if the x-position of the mouse is less than 400. Additionally, the condition `mouseY < 150` has been changed to `mouseY > 150` to correctly check if the y-position of the mouse is greater than 150. This ensures that the button color changes only when the mouse is pressed within the specified button boundaries.
In your code, there is a logical error in the if statement condition. The condition you wrote checks if the mouseX is greater than 50 and also greater than 250, which is not possible. It seems like you intended to check if the mouseY is less than 150 instead.
To fix this error, you need to change the condition from `mouseX > 50 && mouseX > 250` to `mouseX > 50 && mouseX < 250`.
Here's the corrected code:
```javascript
draw = function() {
fill(0, 255, 68); // start color
if (mouseIsPressed && mouseX > 50 && mouseX < 250 && mouseY < 150 && mouseX < 400) {
fill(33, 112, 52); // click color
}
rect(50, 150, 250, 100); // the button
// The button text
fill(0, 0, 0);
textSize(30);
text("PRESS ME!", 93, 193);
};
```
Now the condition properly checks if the mouseX is greater than 50, less than 250, mouseY is less than 150, and mouseX is less than 400 before changing the fill color.