Why doesn't the HTML 5 canvas feature work in Internet Explorer?

Question

css

I have an image that renders fine in canvas in Google Chrome and Mozilla Firefox, but doesn't render in Internet Explorer 10. Why is this and how can I fix it?
Here is my codepen .

Answer 1

Why is this happening))) Because it's IE! Even in the new versions, nothing nichrome does not work.
IE didn't even implement half of the html5 tags in the latest version.
You can look here html5accessibility.com
And Internet Explorer only supports with the explorercanvas library

Answer 2

Well, in general, the code is not so hot and works in normal browsers by coincidence. It is not at all guaranteed that a picture created dynamically on window.onload will be loaded.
This is how it should be:

window.onload = draw;

function draw() {
    var canvas = document.getElementById("canvas");
    var ctx = canvas.getContext('2d');

    var hills = new Image();
    hills.src = 'http://7-themes.com/data_images/out/73/7022406-forest-background.jpg';
    
    canvas.setAttribute('width', window.innerWidth);
    canvas.setAttribute('height', window.innerHeight);
    
    hills.onload = function () { // теперь, когда картинка загрузилась, можно и нарисовать
        ctx.drawImage(hills, 0, 0, canvas.width, canvas.height);
    }
}

Answer 3

Shit, I wouldn't bother if I were you. Check the user, if he is sitting with ie redirect him to the download page of a normal browser. I have several projects with this twist
Or here is another library
ruseller.com/lessons.php?rub=37&id=1951

Answer 4

caniuse.com/#search=canvas
In general, it is not clear why Canvas is needed here.

Answer 5

All because the explorer is creepy, and there is a feature that one and the same version of the explorer can support on one computer and not on the other. It's because of the service pack.