0 votes
asked by (220 points)
Hi, I'm using Harlowe 2.1.0 and am curious about how to make a link that jumps to the top of the current page.

Adding an anchor <a href="#top"> doesn't quite work because it doesn't scroll to the *very* top of the page, only to the highest point I can place an element with an ID.

Any ideas?

3 Answers

+1 vote
answered by (109k points)
selected by
 
Best answer

Try the following instead.

<tw-link onclick="window.scrollTo(0,0)" tabindex="0">back to top</tw-link>

or

<tw-link onclick="window.scroll(0,0)" tabindex="0">back to top</tw-link>

 

commented by (220 points)
Thanks both! The only reason I think that these don't work for me is because of how I have my story formatted - the outside page is always fully scrolled up, and the scrolling only happens within the tw-passage element.

Do you know if there's any way to give the tw-passage element an id, so I can navigate to it with a # link?

No worries if this is a bit obscure, think I can figure it out from here :)
+1 vote
answered by (52.4k points)

Try something like: 

<tw-link onclick="scroll(0, 0)" tabindex="0">back to top</tw-link>

 

commented by (220 points)
Hi, for me this does not work :(, it creates a link that when I click it, nothing happens. Does it only work on certain browsers?
commented by (109k points)
Chapel forgot to implicitly state which element to scroll to the top of.
commented by (52.4k points)
Thanks greyelf.
0 votes
answered by (52.4k points)

the outside page is always fully scrolled up, and the scrolling only happens within the tw-passage element 

That's pretty important info.  Here's some code to  place in Story JavaScript.

$(document).on('click', '#to-top tw-link', function () {
    $('tw-passage').scrollTop(0);
});

To use it in passage:

<span id='to-top'>(link-repeat: 'Return to top.')[]</span>

 

Welcome to Twine Q&A, where you can ask questions and receive answers from other members of the community.

You can also find hints and information on Twine on the official wiki and the old forums archive.

See a spam question? Flag it instead of downvoting. A question flagged enough times will automatically be hidden while moderators review it.
...