mousewheel multiple instance conflict

Question

I'm actually writting a svg gallery plugin using the svg.js librairy. I'm confronted to a problem I am not able to resolve... I need to create some instance of the same gallery, they are all binded to the mousewheel event, everything works fine except this event mousewheel. The action is only played in one of the svg rendered, but it takes the value of the current one. It seems the mousewheel event is only binded to one SVG element... I've done a jsfiddle to try to isolate to nasty part.

http://jsfiddle.net/dredtrake/SDSk6/1/

console.log(this);

Inside the functions/methods returning me the good instance too.

Thank you for your interrest in my problem.

André.

:)

It's good to have a JSFiddle, but I'm sure you could reduce it to demonstrate the problem in a way that is easier to read. — GarethOwen, Nov 11 '13 at 15:41
Here's a hint - at least in firefox, it receives the event properly in each canvas, but it's acting on the final canvas added. (I tested by adding a third canvas, just to be sure - http://jsfiddle.net/dredtrake/SDSk6/4/). So it has something to do with the way you're binding it. The `this` variable is always set to the last instance. — Scott Mermelstein, Nov 11 '13 at 15:57
Hi there, I've allready reduced my page , indeed , I will reduce it more on next time ;) @ScottMermelstein : Your link isn't working (Error 404), anyway I've found the solution on the nex answer , Thx. — dredtrake, Nov 12 '13 at 01:31

score 1 · Answer 1 · edited May 23 '17 at 10:25

It seems that images array prototype refer to a global variable (maybe document.images?) when you push them. When the second array was being poplated, it was overwriting first images.

So I put the declaration of images in the constructor and it works.

var SvgTests = function (params){
    var defaults = {
                _item : 'canvas',
                _duration : 650
            };

    this.images = [];
    this.options = JQUERY.extend({}, defaults, params);
};

Fiddle

Note : You should declare your variables in your constructor instead of creating a prototype for each one.

best approach to member variables in object-oriented javascript?

Bonne chance ! :)

Hello, what you mean by accept your answer ? you mean vote ? (I still can't in fact ) — dredtrake, Nov 12 '13 at 11:57

mousewheel multiple instance conflict

1 Answers1