Basic HTML5/Canvas Setup. Browser issues
I have this basic HTML5/Canvas setup. It works fine in Chrome and Firefox. However, I am having these browser issues:
- If I load the page about ten times in IE8, it will typically work at least once... I know this sounds strange; I can only guess it has something to do with the order the JavaScript is being executed(?).
- The text does not appear in my iTouch.
Edit: I am having some formatting issues with this code. Excanvas is used (but not seen below).
<!DOCTYPE html>
<html lang="en">
<head>
<!--[if IE]><script type="开发者_StackOverflowtext/javascript" src="js/excanvas.js"></script><![endif]-->
<script type="text/javascript">
function addBox(x, y, text){
context.font = '17px Arial';
context.textBaseline = 'top';
context.fillStyle = 'black';
context.fillText (text, x, y);
}
function resetCanvas(){
c = document.getElementById("myCanvas");
context=c.getContext("2d");
c.width = 450;
context=c.getContext("2d");
//Draw Picture Frame around Canvas
context.lineWidth = 5;
context.strokeStyle="blue";
context.strokeRect(5,3,430,430);
}
$(document).ready(function() {
resetCanvas();
addBox(200, 200,'hello');
});
</script>
</head>
<body>
<canvas id="myCanvas" width="900" height="450" >Your browser does not support the canvas element.</canvas>
</body>
</html>
- IE8 doesn't support canvas, so whatever you're seeing it's not a canvas issue
- Are you sure your iTouch has the Arial font available? What happens if you try
sans-serifinstead?
加载中,请稍侯......
精彩评论