Change url when manually scrolled to an anchor?
Try using this jquery plugin: Scrollorama. It has tons of cool features and you can use window.location.hash
to update your browsers hash.
Alternatively, you can add a "scroll" event to check when an anchor is reached.
Here is a working fiddle to illustrate the event: http://jsfiddle.net/gugahoi/2ZjWP/8/ Example:
$(function () {
var currentHash = "#initial_hash"
$(document).scroll(function () {
$('.anchor_tags').each(function () {
var top = window.pageYOffset;
var distance = top - $(this).offset().top;
var hash = $(this).attr('href');
// 30 is an arbitrary padding choice,
// if you want a precise check then use distance===0
if (distance < 30 && distance > -30 && currentHash != hash) {
window.location.hash = (hash);
currentHash = hash;
}
});
});
});
you can use HTML 5 pushstate to change the URL in the address bar
window.history.pushstate
- https://developer.mozilla.org/en-US/docs/DOM/Manipulating_the_browser_history
- How can I use window.history.pushState 'safely'