Here is an interesting riddle, I have javascript data that works fine in Safari / Chrome and even works in IE. But Firefox is really very slow. I noticed a section of code that seems to slow down.
Variable statistics var stats = [{"team":"IND","player":"Andrew Luck","position":"QB","round":1,"choice":1,"size":66}, ... ];
Here is the full code. The problem area is at the bottom. Does anyone know why Firefox is having problems with this?
(function($){
$(document).ready(function() {
var paper = Raphael("graph",390, 1600);
var selectedteam;
for (var i = 0 ; i <= 252; i++) {
var s = stats[i].size*.3;
stats[i].circles = paper.circle(stats[i].round*50-20, stats[i].choice*20, s*.75)
.attr({
"fill": "RGB(" + (89*.3-s)*14 + ", " + s*8 + ", 100)",
"stroke": "RGB(255,255,255)"
})
stats[i].circles.player = stats[i].player;
stats[i].circles.team = stats[i].team;
stats[i].circles.position = stats[i].position;
stats[i].circles.mouseout(function() {
for (var lines in stats) {
stats[lines].circles.animate({"opacity": "1"}, 500);
}
});
stats[i].circles.mouseover(function() {
selectedteam = this.team;
$('#error').empty().html("<div><p>" + this.player + ", " + this.position + "</p><p>" + this.team + "</p></div>");
for (var lines=0; lines <=252; lines++) {
stats[lines].circles.stop().animate({"opacity": ".1"}, 50);
if (selectedteam === stats[lines].team) {
stats[lines].circles.stop().animate({"opacity": "1"}, 50);
}
}
});
}
});
})(jQuery);
source
share