页面跳转时从URL隐藏哈希

Question

I have a link on my menu that targets to an anchor on another page.

<a href="http://www.mylink.com.br/mylink/#anchor">

And I want to hide the #anchor from URL.

---

I've tried another solution, look:

$('#menu #mylink2').click(function() {
   document.location.href = "www.mysite.com/mysite/";
});

and then, I need to activate a script to scroll to the div after the page loads:

$(document).ready(function(){
    $('html, body').animate({ scrollTop: $("#divtoscroll").offset().top }, 2500);
});

but I don't know how to attach that event to the previous. The way it is, everytime the page loads, it scrolls to the div.

Any help?

---

I did it! I added "contato" on the final of the URL to differentiate it from the other links.

$('#menu #mylink2').click(function() {
   document.location.href = "www.mysite.com/mysite/contato";
});

And used it to recognize the URL and activate the document ready function.

var url = "www.mysite.com/mysite/contato";
if (location.href==url) {
    $(document).ready(function(){
        $('html, body').animate({ scrollTop: $("#allcontentcontact").offset().top }, 2500);
    });
}
else {
}

Works perfectly! Thanks for the help.

Answer 1

As far as I am aware it is not possible to do this, as it is what tells the browser which section of the page to jump to.

You may be able to do this using the amount of pixels and javascript, but it would not work for all cases. Example:

 window.scrollBy(0, 500);

You could use jQuery to scroll to a specific element ID on a page, but this would require a trigger on that page, such as a click, or even page load. Example below uses click.

$("#button").click(function() {
$('html, body').animate({
    scrollTop: $("#elementtoScrollToID").offset().top
}, 2500);

});