Go to anchor link on click event jquery

Question

As the descriptions says, I've found many things about smooth scrolling and the location property on java script but nothing seems to do what Im looking for which is simply imitate the function of a html "a" tag (I need to NOT use the html link tag for this project)

score 5 · Answer 1 · edited Oct 23 '17 at 08:21

So what i get is you want to scroll down to an element without using html anchor tag If i am right Assuming you have a html input tag

<input type="button" id="top" value="button"/>

this script will do the work

P.S #bottom_id is the id of element you want to scroll to. or anchor link:

<a href="#bottom" id="bottom_id"></a>

script:

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

score 1 · Answer 2 · edited May 23 '17 at 11:53

1

The jquery way:

$("body").scrollTop($("[name=elementname]").position().top)

This gets the top of the named element and sets the scroll top position to that location.

There is a jquery plug in which does this effectively, but if you want to stick to straight javascript you can just use element.scrollTo as described on this previous answer;

Better documentation for this can be found on Mozilla's site. With javascript.

edited May 23 '17 at 11:53

Community

1
1

answered Jan 12 '17 at 23:20

Ogre Codes

18,693
1
17
24

Jquery would be way more convenient and T think using "scrollTo" is a clever way to do it as in the plug in, if there is no other way to do it, I think i will do it like that, but I was hoping there would be another way, something like an already defined function that would do the trick, maybe the goToURL() function but thank you, this is helpful of course – Marco Ramirez Castro Jan 12 '17 at 23:25
I added some flavor to the answer using an example. Not a built in method, but simple enough. – Ogre Codes Jan 12 '17 at 23:27

score 0 · Accepted Answer · answered Jan 12 '17 at 23:29

0

To make JQuery take the user to a different URL than the page (like an anchor tag) attach window.location to the event.

For example, this:

$('#ClickMe').click(function(){ window.location = 'index.php'; });

Would take the user to index.php if he clicks on the element that has the ID "ClickMe" (E.G. ...

answered Jan 12 '17 at 23:29

Paurian

1,372
10
18

1

Hah, I misread the question I think. For some reason I thought he meant just jumping to a name tag on the same page. – Ogre Codes Jan 12 '17 at 23:38

Go to anchor link on click event jquery

3 Answers3

Linked