This project is archived and is in readonly mode.

#554 ✓duplicate
Anthony McLin

SmoothScroll doesn't work with offset option because of win.location.hash

Reported by Anthony McLin | January 15th, 2009 @ 07:22 PM

Since smoothscroll just extends Fx.Scroll, you can use the offset option to align the final position slightly differently than where the browser things the target scrollto point is.

However, at the end of the smoothscroll behavior, smoothscroll is trying to set the final position, which ends up ignoring the offset.

The what happens here is that if you provide an offset position, you get a nice scroll behavior to the offset location, and then the browser jumps to the target position, not the offset position.

Try the following:

window.addEvent('domready',function() {
    new SmoothScroll({
        duration:   1200,
        offset: {
            'x': 0,
            'y': 100
    }, window);

A fix for this is to comment out the win.location.hash call ound at the end of the smoothscroll initialize function.

The win.location.hash call nicely changes the browser's URL, just as if smoothscroll wasn't enabled, but it breaks offset functionality.

Comments and changes to this ticket

  • Carlos Ouro

    Carlos Ouro January 24th, 2009 @ 02:57 PM

    • Tag set to smoothscroll, url

    But then you couldn't get the url changed for url#anchor .

    The fix for this is slightly more complicated - you have to change the hash when the scroll position == the element position during the effect, and not onComplete .

    PS: Also smoothscroll doesn't scroll to offset when coming from an external page.

    Let me know if i can be of any help.

  • Aaron Newton

    Aaron Newton February 18th, 2009 @ 11:31 PM

    • Assigned user changed from “Valerio” to “Aaron Newton”
    • Milestone cleared.
  • fakedarren

    fakedarren February 8th, 2010 @ 03:27 PM

    • State changed from “new” to “open”
  • Carlos Ouro

    Carlos Ouro February 8th, 2010 @ 03:38 PM

    Just noticed: the solution i proposed does not always work, the movement can be set up in such way that you don't actually pass through the elements position.

    The only other solution i can guess is to:
    onComplete, change the elements id to something temporary, then insert an absolute invisible Element "top"ped to viewport's top, then change location hash, then remove temporary element and reset the real elements id.

    Hope it helps.

  • Christoph Pojer

    Christoph Pojer September 3rd, 2010 @ 01:28 PM

    • State changed from “open” to “duplicate”
    • Milestone order changed from “0” to “0”

Create your profile

Help contribute to this project by taking a few moments to create your personal profile. Create your profile »

Shared Ticket Bins

Referenced by