Scroll to anchor on another page

[maximilianm]

Hi all, I have a question:
I have one overview page with various projects, one project per row. Now when somebody is on a project subpage a link from there should go back to the overview page and then smooth scroll to the row with the project he was before.

I gave all rows on overview page a unique id and the link on the subpage to get back is like href="www.domain.com/overviewpage/#id". Now I need a script for anchor and smooth scroll, right? Can somebody help? All threads regarding scrolling to anchors here in the forum couldn't solve the problem.

[maximilianm]

This here at custom head content results in a
TypeError: undefined is not an object (evaluating '$(target).offset().top')

<script>
jQuery(document).ready(function($){
    var jump=function(e)
{
   if (e){
       e.preventDefault();
       var target = $(this).attr("href");
   }else{
       var target = location.hash;
   }

   $('html,body').animate(
   {
       scrollTop: $(target).offset().top
   },2000,function()
   {
       location.hash = target;
   });

}

$('html, body').hide();

$(document).ready(function()
{
    $('a[href^="#"]').bind("click", jump);

    if (location.hash){
        setTimeout(function(){
            $('html, body').scrollTop(0).show();
            jump();
        }, 0);
    }else{
        $('html, body').show();
    }
});
});
</script>

[maximilianm]

Or maybe it's because how Laytheme handles links with anchors?

When I enter
http://domain.com/page#anchor
it's changed to
http://domain.com/page/anchor

It only works correct when I'm already on the page, where the anchor is.

[DMB]

Hey man, I figured this out last week but then ended up not using the smooth scroll!

So in custom head content put this:

<!--SMOOTH SCROLL ANCHOR POINTS-->

<script>
jQuery(document).ready(function(){
jQuery('body').on('click', '.yourclasshere', function(event) {
event.preventDefault();
var id = jQuery(this).attr('href');
jQuery('html, body').animate( { scrollTop: jQuery(id).offset().top }, 750, 'swing' );
});
})
</script>

So obviously you need to replace 'yourclasshere' with your own class name.

What I was using this script for was for several text links at the top of the page which would just scroll down to a certain point underneath where each image was.

In that case I assigned the point I wanted to arrive at an #id and then in the text editor using the 'link' button entered this id '#youridhere'.

I then had to go into the html editor in the text editor and manually add in the class in my JS script before the href link.

That way all my anchors were smooth scrolling.

I'm not entirely clear what you want to smooth scroll but hope you can adapt my code :)

Best,

Duncan

[maximilianm]

@DMB
Nice one thanks!

Will check it out asap, though I don't think it works in my case as my links refer to another page (not the same as anchor) so I'm not sure if the script works.