Buenas a todos!!
Comprobar la compatibilidad del navegador con el Canvas es muy simple:
<html>
<head><title>Compatibilidad canvas</title></head>
<body>
<canvas id='c'>Canvas no soportado!</canvas>
<script languaje="JavaScript">
var canvas;
var ctx;
var WIDTH = 480;
var HEIGHT = 320;
function init() {
canvas = document.getElementById('c');
if(canvas.getContext){
canvas.width = WIDTH;
canvas.height = HEIGHT;
ctx = canvas.getContext('2d');
ctx.fillStyle = '#73CC00';
ctx.beginPath();
ctx.rect(0, 0, WIDTH, HEIGHT);
ctx.closePath();
ctx.fill();
}else{
alert("Canvas no soportado!");
}
}
window.onload = init;
</script>
</body>
</html>
Cuando recogemos un elemento <canvas>, si comprobamos que contiene la función getContext, entonces significa que es compatible, en caso contrario el navegador no da soporte al canvas.
canvas = document.getElementById('c');
if(canvas.getContext){
//Soporta el canvas
}else{
//No soporta el canvas
}
El texto que incluimos entre los tags <canvas>, será visible en caso de que el navegador no de soporte al canvas.
<canvas id='c'>Canvas no soportado!</canvas>
Así de fácil! Un saludete!