Anchor links

About

MatVonTWaddle24th January 2022 at 11:24pm

$:/.macro/AnchorLinks is a macrofication of the anchor links technique, i.e to create links within a tiddler for navigation therein.

Use

It defines the two macros: linkfrom and linkto

Here is a description how to use them (found in the description field in the macro tiddler so you can refer to it when you want):

<<linkfrom 'title' tag>> - this is the link. tag (optional) is an optional wrapping html tag e.g h2 instead of !!
<<linkto 'title'>> - this is the anchor
Note: Any title or arbitrary string can be used; it is (quasi-) uniquified to the current tiddler title and slugified

Tip - smooth scrolling

Add html { scroll-behavior: smooth; } in some stylesheet to make the anchor link scrolling smooth in most browsers.

Alphaindex

MatVonTWaddle18th January 2022 at 8:50am

...so imagine that you have a really long list of e.g names.

...as achieved with:

<div style="position:relative;">
<div style="position:sticky; top:1em; outline:1px solid; padding:0 5px; background:white; border-radius:2px">
<$list filter="""[tag[demo]sort[]] :map[split[]first[]trim[]] +[unique[]]""">
<$macrocall $name=linkfrom title={{!!title}}/>
</$list>
</div>
<br>

<$list filter="""[tag[demo]sort[]] :map[split[]first[]trim[]] +[unique[]]""" >
<$macrocall $name=linkto title={{!!title}}/>
<$list filter="""[tag[demo]sort[]prefix{!!title}]""">

</$list>
</$list>
</div>