Redirect to a div on a different page with smooth scrolling?

Question

Question Background:

I have a 2 page website. Both pages use the same masterlayout.cshtml page which features a Navbar. Within the

Answer 1

How do you redirect to another page, using href value?

If so, also add in data-id for this tag too.

So when you click on Events link, it will go to another html page and you want to scroll to Events div, right?

Then using sessionStorage, you can store and get back the page id, then scroll to its specific div.

Add below script and let's see.

JQUERY

$(document).ready(function(){

    // get sessionStorage for page id
    var get_id = sessionStorage.getItem('pg_id');

    // check page id, then scroll to its div
    if(get_id)
        scrollToID(get_id, 300);

    // click event to scroll to div
    $('.nav li a').on('click', function(){
        var id = '#'+$(this).data('id');
        sessionStorage.setItem('pg_id', id);
        scrollToID(id, 300);
    }); 

});
function scrollToID(id, speed) {
    var offSet = 70;
    var obj = $(id).offset();
    var targetOffset = $(id).offset().top - offSet;
    $('html,body').animate({ scrollTop: targetOffset }, speed);
}

HTML (My sample)

    
Welcome
    
Club
    
About Us
    
Location
    
Events