Hello again...
I am doing a little gadget that uses Fx.Scroll (1.11) to scrollTo with a
transition effect the contents of a layer on domready...
Which works great, but for one little problem:
If you mousewheel down/scroll page as it's still loading and moving the
contents of my layer, the instance of my Fx.Scroll stops and never
completes, leaving the layer partially scrolled and w/o raising my
onComplete events...
I don't think the code itself bears any relevance to this conflict here but
here is the part of my class that drives this, along with the lame
workaround I have put in place (attaching to window.scroll):
...
goToProduct: function(i) {
// go to product with index i.
var _this = this;
prdScrolling = true; // added to recall productScrolling state due to
window.scroll
window.addEvent("scroll", function() {
// need a fix, if window.scroll fires while we are still scrolling, it
stops
// the instance of our Fx.Scroll (productScroll)
if (prdScrolling) {
// go w/o the elastic effects...
_this.get("productContainer").scrollTo(_this.get("moveSteps")*i);
_this.get("productContainer").setOpacity(1);
_this.setButtons(); // fix scrolling left/right buttons as per
scroll state
moveStatus = false;
prdScrolling = false;
}
});
productScroll = new Fx.Scroll(this.get("productContainer"), {
transition: Fx.Transitions.Elastic.easeOut,
duration: 1500,
onComplete: function() {
C.log("done");
moveStatus = false;
prdScrolling = false;
_this.get("productContainer").setOpacity(1);
_this.setButtons();
}
});
var el = this.get("productContainer").getSize();
moveStatus = true;
productScroll.scrollTo(el.scroll.x+this.get("moveSteps")*i, 0);
}, // end goToProduct
Is there an alternative way to do this that does not involve using the
scroll method of the browser (which is what I assume is happening here)?
I could always use Fx.Styles and modify the layer's left css but that's
not ideal...
Thanks in advance!