1

I'm trying to call mozRequestAnimationFrame in firefox, but I keep getting an error. Here is my code:

var obj={
    animFrame:mozRequestAnimationFrame
}

var animF=mozRequestAnimationFrame;

function a(){
 console.log('a called');   
}

animF(a);

obj.animFrame(a);

The error occurs with the obj.animFrame(a); I get an error message of:

Illegal operation on WrappedNative prototype object

I found this thread on SO: requestAnimationFrame with this keyword and then figured that maybe requestanimationframe didn't have the right "this" context, so I tried

obj.animFrame(a).bind(window);

but still got the same error message. So why is the error occurring?

Community
  • 1
  • 1
Yansky
  • 4,580
  • 8
  • 29
  • 24
  • possible duplicate of http://stackoverflow.com/questions/5140156/illegal-operation-on-wrappednative-prototype-object – dievardump Jun 05 '12 at 04:55
  • I don't think my question is the same because referencing mozRequestAnimationFrame to a variable works fine and I'm not changing the function of it either. – Yansky Jun 05 '12 at 05:17

1 Answers1

3

I dont know reason why you need to save pointer to requestAnimationFrame (mozRequestAnimationFrame) into some object, but try next code to avoid error:

var obj={
    animFrame:mozRequestAnimationFrame.bind(window)
}

function a(){
 console.log('a called');   
}

obj.animFrame(a);
Andrew D.
  • 8,130
  • 3
  • 21
  • 23
  • Thanks, that seems to work. I'm saving a reference to it for when they change it in the future and remove the vendor prefix. e.g. `if(!requestAnimationFrame){obj.animFrame=mozRequestAnimationFrame}else{obj.animFrame=requestAnimationFrame}` – Yansky Jun 05 '12 at 05:42
  • Maybe is better to add next code into your js-files: `if(!window.requestAnimationFrame)window.requestAnimationFrame=window.mozRequestAnimationFrame||window.webkitRequestAnimationFrame||window.msRequestAnimationFrame||window.oRequestAnimationFrame||function(callback){window.setTimeout(callback,1000/60);};}` – Andrew D. Jun 05 '12 at 06:10