Search code examples
javascriptjquerypyrocms

Jquery manipulate urls

I am using pyrocms and all nav links are absolute links which won't allow me to make smooth scrolling work on the page.

My smooth scrolling script is

.js

$('.nav a').click(function() {
     $('html, body').animate({
        scrollTop : $($.attr(this, 'href')).offset().top
    }, 500);
    return false;
});

and with pyrocms my links looks like this to divs on the same page

<a href="http://www.mysite.com/index.php/#somelink>Link on the same page</a>

Problem with this is my animate won't work with absoulte urls for some reason. Am I missing something simple, or do I need to convert my links to relative (href="#somelink") with jquery. Is that a possibility. I only need this to work on my nav links as they are all links on the index.php page.

Solution

  • You should use property hash of the anchor tag:

    scrollTop : $(this.hash).offset().top

    DEMO