meltingice / CamanJS

Javascript HTML5 (Ca)nvas (Man)ipulation
http://camanjs.com
BSD 3-Clause "New" or "Revised" License
3.55k stars 404 forks source link

Script Error IE9 #20

Open valentinalisch opened 12 years ago

valentinalisch commented 12 years ago

I'm using IE9 in cooperation with Caman.js

My script is the following. It works perfectly in every browser except for IE9. IE is throwing the following error in it's console:

"SCRIPT5022: DOM Exception: INDEX_SIZE_ERR (1)"

It's not just with this script but with every time I try to use Caman.js in IE9 Not working at all.

[code] function imgDeSat(){ //alert("INIT"); jQuery(window).load(function(){

                             //alert("DESAT");

    /*DEFINTIONS*/
    var speed = 500;
    var saturationVar = -50;
    /**/

    jQuery('.slideshow-item img').each(function(index){

        jQuery(this).clone().prependTo(jQuery(this).css({'position':'absolute','top':'0px','left':'0px'}).parent()).addClass('img-desaturate').attr('id', 'canvasID');

        var target = '.item-'+(index+1);
        var target_img = '.item-'+(index+1)+' img.img-desaturate';   /*<<<<<<<<<<<<<<<<*/

        Caman(target_img).saturation(saturationVar).render();

        jQuery(target).find('#canvasID').css({'position':'absolute','z-index':'99'}).addClass('img-desaturate');

    });

    jQuery('.slideshow-set').mouseover(function(){  
        jQuery(this).find('canvas').stop().animate({opacity:0}, speed);     
    });
    jQuery('.slideshow-set').mouseout(function(){   
        jQuery(this).find('canvas').stop().animate({opacity:1}, speed); 
    });

});

} [/code]

Regards, Valentin

rwaldron commented 12 years ago

Can you create a test case at http://jsfiddle.net or http://jsbin.com - thanks!

a-ntoine commented 12 years ago

I have the same problem. Just run the examples included and you will see.

a-ntoine commented 12 years ago

Only when replacing images though. It works fine with a canvas element.

valentinalisch commented 12 years ago

Just have a look at: http://www.valentinalisch.de/

It throws an error in IE9 "SCRIPT5022: DOM Exception: INDEX_SIZE_ERR (1)". Any help?

valentinalisch commented 12 years ago

Line 319: this.imageData = this.context.getImageData(0, 0, this.canvas.width, this.canvas.height);

this.canvas.width and height are giving back "0"; and so are this.image.width and height.

Why is that?

cassioam commented 12 years ago

Does anyone have a solution for this?

I spent a few days developing something on Chrome only to find out it doesn't work in IE9, despite the home page saying it is supported by IE9.

As of right now the examples are breaking in IE9 (http://camanjs.com/examples).

I will delve into the source code to see if I can figure something out, but any help would be appreciated.

Thanks

ghost commented 9 years ago

Has anyone been able to get this to work? Is the only solution to create Caman on an existing canvas element?

Thanks,