2023-10-20 02:32:10 -05:00
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html lang="pl">
|
|
|
|
|
|
|
|
|
|
<head>
|
|
|
|
|
<meta charset="UTF-8">
|
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
|
|
<title>Strona z ciekawym wykorzystaniem JS</title>
|
|
|
|
|
<link rel="stylesheet" href="style.css"/>
|
|
|
|
|
<script defer src="script.js"></script>
|
|
|
|
|
</head>
|
|
|
|
|
|
|
|
|
|
<body>
|
|
|
|
|
<div id="menu">
|
2023-10-27 02:30:16 -05:00
|
|
|
<label for="colorSelector">Wybierz kolor: </label>
|
|
|
|
|
<select id="colorSelector">
|
2023-10-20 02:32:10 -05:00
|
|
|
<option value="green">Zielony</option>
|
|
|
|
|
<option value="red">Czerwony</option>
|
|
|
|
|
<option value="yellow">Żółty</option>
|
|
|
|
|
<option value="orange">Pomarańczowy</option>
|
|
|
|
|
<option value="gray">Szary</option>
|
|
|
|
|
<option value="black">Czarny</option>
|
|
|
|
|
<option value="lime">Limonkowy</option>
|
|
|
|
|
</select>
|
2023-10-27 02:28:15 -05:00
|
|
|
<label for="weightSlider">Wybierz grubość linii: </label>
|
2023-10-27 02:30:16 -05:00
|
|
|
<input type="range" min="5" max="40" value="5" id="weightSlider"/>
|
2023-10-27 02:28:15 -05:00
|
|
|
<button id="clearButton">Wyczyść rysunek!</button>
|
2023-10-20 02:32:10 -05:00
|
|
|
</div>
|
|
|
|
|
<canvas id="canvas"></canvas>
|
|
|
|
|
</body>
|
|
|
|
|
|
|
|
|
|
</html>
|
