$anchorScroll Offset

[leeola]

Just a quick feature request.

If your app has a fixed position header, $anchorScroll will "incorrectly" position the scroll for the users view. Nothing is broke here, but allowing for an $anchorScrollProvider offset number would be nice.

Basically, right after elm.scrollIntoView() it would execute roughly.. if (offset > 0) $window.scroll($window.scrollX, $window.scrollY - offset);. This would allow $anchorScrollProvider & $anchorScroll to play nicely with fixed position headers.

[leeola]

Funny enough, i noticed that even the official docs suffer from this same problem.

http://docs.angularjs.org/api/AUTO.$provide#factory

Notice how when you visit that url, you cannot see the title for that documentation? It's because it is hidden behind the page header, haha.

[davidchang]

Volunteer

[davidchang]

Actually, the underlying scroll functionality comes from https://developer.mozilla.org/en-US/docs/DOM/element.scrollIntoView which doesn't allow for an offset. Doing the $window.scroll after calling elm.scrollIntoView() may be obviously hacky.

[andymcfee]

+1 for a solution to this problem

[kapilkale]

+1 here as well. Probably not uncommon to want a 10-20 pixel offset from the element being scrolled to.

[leeola]

Actually, the underlying scroll functionality comes from https://developer.mozilla.org/en-US/docs/DOM/element.scrollIntoView which doesn't allow for an offset. Doing the $window.scroll after calling elm.scrollIntoView() may be obviously hacky.

Yea, that's why i haven't asked for my code to be pulled in. It's hacky, but i'm not aware of any other way. Anchors on my site would be broken without it heh.

[rickhuizinga]

+1 here too.

[yellowrangler]

I wrote the following in my controller. Really awful hack put could not figure any other way. Am new to Angular; but thought i would share.

$scope.goToInternalHash = function(id, offset) {
$location.hash(id);
$anchorScroll();
setTimeout(function(){
window.scrollTo(window.pageXOffset, window.pageYOffset - offset);
},300);

[trask]

Adding invisible anchor tags with negative relative offset seems like a nice workaround for this issue, e.g. http://stackoverflow.com/a/13184714/295416

Might as well be using angular-ui and bootstrap Scrollspy or wrapping some other plugin in a service.

[pavelnikolov]

I have the same problem.

[rjelte]

+1 for a solution to this

There are any number of little hacks that can be implemented, but it would be nice if there was something built in.

[mikeobrien]

+1

[mrzepinski]

+1

[paul-lemon]

+1