JavaScript isn't showing up on HTML page
Question
I'm new to programming, and am trying to make a simple calculator. After writing some code, I realized that my JavaScript code wasn't showing up on my HTML page. Please tell me what's happening.
Here's my HTML code:
<!DOCTYPE html>
<html>
<head>
<title>
Simple GUI Calculator
</title>
<script src="Calculator.js"></script>
</head>
<body>
</body>
</html>
Here's my JavaScript code:
strokeWeight(1);
var x = 10;
var y = 140;
var xDiff = 113;
var yDiff =70;
var buttonSize = 40;
fill(95, 95, 95);
rect(1, 1, 398, 400);
fill(255, 255, 255);
rect(10, 10, 380, 100);
fill(5, 4, 4);
rect(x, y, buttonSize, buttonSize);
rect(x + xDiff, y, buttonSize, buttonSize);
rect(x + 2 * xDiff, y, buttonSize, buttonSize);
rect(x + 3 * xDiff, y, buttonSize, buttonSize);
rect(x, y + yDiff, buttonSize, buttonSize);
rect(x + xDiff, y + yDiff, buttonSize, buttonSize);
rect(x + 2 * xDiff, y + yDiff, buttonSize, buttonSize);
rect(x + 3 * xDiff, y + yDiff, buttonSize, buttonSize);
rect(x, y + 2 * yDiff, buttonSize, buttonSize);
rect(x + xDiff, y + 2 * yDiff, buttonSize, buttonSize);
rect(x + 2 * xDiff, y + 2 * yDiff, buttonSize, buttonSize);
rect(x + 3 * xDiff, y + 2 * yDiff, buttonSize, buttonSize);
rect(x, y + 3 * yDiff, buttonSize, buttonSize);
rect(x + xDiff, y + 3 * yDiff, buttonSize, buttonSize);
rect(x + 2 * xDiff, y + 3 * yDiff, buttonSize, buttonSize);
rect(x + 2 * xDiff + 90, y + 3 * yDiff, buttonSize + 23, buttonSize);
2 answers
solution1
1 ACCPTED 2013-03-22 23:47:03
You are using canvas API, but you do not have any canvas in HTML.
Try tutorial on canvas: https://developer.mozilla.org/en-US/docs/HTML/Canvas/Tutorial . Then see documentation & libraries: https://developer.mozilla.org/en-US/docs/HTML/Canvas .
solution2
0 2013-03-22 23:48:03
The functions you are using aren't in JavaScript per se. They are JavaScript properties and methods of the canvas object in HTML 5. You can use this link to find out how to access a canvas object and use your code as methods applied to the canvas object that you will have created. http://www.w3schools.com/html/html5_canvas.asp
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.