Alternative to WebGL if not loading

Question

I have some WebGL stuff in an iframe. On some web browsers or old computers, the iframe isn't loading. When this happens I'd like to load an image instead. Is it possible and if yes how to do it ?

Thanks

It would be good if you could [edit your question](http://stackoverflow.com/posts/12585898/edit) and add some code what you have already tried. This way you will get better and more precise answers. — Sampo Sarrala - codidact.org, Sep 25 '12 at 17:49

score 1 · Answer 1 · answered Sep 25 '12 at 15:13

1

Wether or not WebGL is supported is probably best checked the same way you do in Javascript

WebGLRenderingContext gl = canvas.getContext("experimental-webgl")

if(!gl)
{
    $("#image").show()
}

answered Sep 25 '12 at 15:13

Baba

94,024
28
166
217

You are welcome , if it answers your question .. you can click on accept by the side – Baba Sep 25 '12 at 15:29
hi and thx for ur answer but i can't get it working. My code is : echo''; but there is neither the webgl animation nor the image – user1697711 Sep 25 '12 at 15:32
Please you need to have predefined the image , i was just showing how to check for webGL – Baba Sep 25 '12 at 15:33

score 1 · Answer 2 · edited May 23 '17 at 11:43

Problems in `<script>`:

First of all it seems that you have some problems within your <script> tag. There is plain <center><iframe ... HTML tags inside <script> tag which does not work as there should be only javascript here. There is also some missing ; semicolons.

Solutions to detect WebGL:

You could try this one but I also recommend checking out linked sites at end of my answer:

?>
<script type="text/javascript">
if (!window.WebGLRenderingContext) {
    var myImage = new Image();
    myImage.src = "http://domain.tld/picture.jpg";
    $(myImage).prependTo(document.body);
} else {
    $(document.body).prepend('<center><iframe ALLOWTRANSPARENCY="true" frameborder="0" height="340" width="454" src="CORRECT THIS FIELD"></iframe></center>');
}
</script>
<?php

Just add echos for PHP and correct <iframe src="CORRECT THIS FIELD"> attribute, also set image url to something that really exists.

In place of document.body you could use for example '#myWebGLArea' and add <div id="myWebGLArea"></div> to your page.

Alternative to WebGL if not loading

2 Answers2

Problems in `<script>`:

Solutions to detect WebGL:

More on topic:

Alternative to WebGL if not loading

2 Answers2

Problems in <script>:

Solutions to detect WebGL:

More on topic:

Problems in `<script>`: