Search code examples
javascriptfirefoxanimationscrollyui

YUI 3.10 Simple scroll animation

We moved our project to latest YUI version and some problem which should be trivial became night mare.

Goal: Click on 'back to top' element need to move our users to top element

Animated Scroll inside Firefox doesn't work any more. There is the code:

navElem.on('click', function(el){
    var y = 1000;
    anim.set('to', { scroll: [0, y - Y.one('.fixed_header').get('scrollHeight')] });
    anim.run();
});

This code works in Google Chrome.

I have read somewhere that 'scroll' as anim option was removed with new version. If we can't use anim anymore, how can we created an animated scroll?

Solution

  • As noted in the comments, you should point Anim's node attribute to "win" rather than "body", ie:

    var anim = new Y.Anim({
  duration: 0.5,
  node: 'win',
  easing: 'easeBoth',
  to: {
    scroll: [0, 0]
  }
});

    YUI then knows how to normalize across browsers which node to scroll.