CODEWITHSUNDEEP
javascriptjquery
dedi wibisono
dedi wibisono

Reputation: 533

How to auto scroll to another page using jQuery

I have two file in index and profile. I want to go to profile page and directly to section faq by automate scrolling

My index

<a href="profile.html">Go</a>

My Profile

<section id="home" style="height:500px;background:red">
<section id="name" style="height:500px;background:yellow">
<section id="faq" style="height:500px">

Is it possible when I click from homepage directly to id="faq" in profile page? Thank you

Upvotes: 0

Views: 56

Answers (2)

harryzcy
harryzcy

Reputation: 27

You can just use an anchor link profile.html#faq to jump there, do not need jQuery, if you do not need scolling animations.

But if you do, you need jQuery to handle that:

$('a[href*=#]').click(function(event){
    $('html, body').animate({
        scrollTop: $( $.attr(this, 'href') ).offset().top
    }, 500);
    event.preventDefault();
});

Upvotes: 1

Hanif
Hanif

Reputation: 3795

Yes you can do that:

At first give a name in anchor tag something like that in profile.html page in preferred location where you want to scroll:

<a name="jumpHere">somewhere</a>

And then set link location like following:

<a href="profile.html#jumpHere">Go</a>

Right now click on expected element you can trigger top link or on write something like following:

$("#faq").click(function(){
    window.location = 'profile.html#jumpHere';
})

Upvotes: 1

Related Questions