Почему в jCanvas, когда ширина и высота совпадает с окном, то координаты и ширина и высота самого прямоугольника ведут себя "неадекватно". Тобишь ширина растягивается чуть ли больше половины экрана ширины, и координаты не совпадают вообще. Хотя указывал меньше
jQuery вместе с jCanvas
$(document).ready(function($) {
let $canvas = $('#canvas');
$canvas.width($(window).width());
$canvas.height($(window).height());
$canvas.drawRect({
fillStyle: 'steelblue',
strokeStyle: 'blue',
strokeWidth: 4,
x: 0,
y: 0,
fromCenter: false,
width: 200,
height: 100
});
});
HTML:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<title>Infinity</title>
<link rel="shortcut icon" href="images/CD.ico" type="html/x-icon"/>
<link rel="stylesheet" type="text/css" href="css/style.css"/>
<!-- <link rel="stylesheet" href="css/jquery.fullPage.css"> -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"/>
<!-- <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> -->
<script src="https://code.jquery.com/jquery-3.2.1.js"></script>
<script src="java/script.js" type="text/javascript" defer></script>
<script src="java/jcanvas.min.js"></script>
<!-- <script src="java/jquery.fullPage.js"></script>
<script src="java/jquery.slimscroll.min.js"></script> -->
<!-- <script src="java/anime.min.js"></script> -->
</script>
</head>
<body>
<canvas id="canvas" style="display: block;"></canvas>
</body>
</html>
