Widget Message tm-scroll and documentation

I missed that, this can solve many problems easily especially replacing the html anchor functionality with less hacking.

I will post a new topic when I refine the solution I am developing given this “morsel” of information.

1 Like

WOW!

This is absolutely amazing! Why this is not documented?

file:///I:/TW5%20Intranet/MyBundles/Working/tiddlywiki.com.html#WidgetMessage%3A%20tm-scroll

5.1.23 and 5.2.2 changes plus jargon rich

target Target DOM node the scrollable container should scroll to note that this parameter can only be set via JavaScript code

Hi @Mohammad , it is documented :slight_smile:

I found the entry to tm-scroll, but no example of what I learned here e.g. link to string within a single tiddler. Some usecases for my

  • link to footnotes in a single tiddler
  • small table of content in a single tiddler
  • link to tables and equations in scientific text (what is called cross-reference in MS Word)

So I really appreciate your post here! and I hope I (or other volunteers) create some examples for tiddlywiki.com

If your footnotes are wrapped in a div with class footnotes:

<$action-sendmessage $message="tm-scroll" selector=".footnotes"/>

Note that you may need to qualify your selector with a CSS selector specific to the open tiddler if there are multiple tiddlers open with footnotes. The data-tiddler-title attribute is useful here.

1 Like

Wonderful! Thank you Saq!
I am thinking a tiny plugin called for example cross-reference may facilitate the process here!
With the advent of TW-Gatha, it is a piece of cake to create a small plugin! Hope a volunteer does this :wink:

The docs do already include quite a detailed example:

https://tiddlywiki.com/#Anchor%20Links%20using%20HTML

Hi Jeremy!
Thank you! The link you have provided uses another technique! It uses href + id

The one with tm-scroll gives new solution which is simpler and more TW way!

In my original post I meant documentation examples for tm-scroll

I have successfully use tm-scroll to an arbitrary html attribute using something like this;

<$action-sendmessage $message="tm-scroll" selector="[anchor='$string$']" animationDuration="$time$"/>

The problem I see is, if you want a working example, is that the tiddler for tm-scroll is very short. So you can’t really scroll within the tiddler. To show the effect, you would have to open some larger tiddler and then scroll within it. Requiring a second tiddler might be awkward.

Another possibility is an example tiddler, which deliberately has extra vertical space inserted. You could then scroll from the top to the bottom of the tiddler. It would be a different kind of tiddler.

<$button> Scroll to bottom</$button>
.
. Scroll Test
. 
. Scroll Test
. 
. This space for rent
.
. Scroll Test
.
... repeat ...
<$button> Scroll to top</$button>

It works even in a small tiddler.

  1. download In Tiddler Navigation.json (316 Bytes)

  2. drag and drop into TiddlyWiki Pre-release — 5.2.3-prerelease

  3. Open In Tiddler Navigation

  4. Click Goto One

  5. It should scroll to Hi first location

If the tiddler is the only tiddler in the river, then you won’t see any scrolling. That’s why I was suggesting that you would have to make an extra long tiddler for demonstration purposes.

Does this scrolling only apply to 5.2.3-prerelease?

That’s true! Also when it is the last tiddler! Tiddlywiki has the same issue with internal links e.g. [[My Tiddler]] !
I am not sure where, but I think Jeremy discussed this before.

The example also works in 5.2.2 I have not tested in previous release.

All the comments here seem contrary to my own experience. I was stalled in demonstrating a solution I have built due to Open then scroll to anchor in tiddler however I will build it with a feature to open tiddlers not already in the story.

To complicate things the split to another thread activity can divide the issue. Personally I would favor create new threads and link between the two rather than removing posts that organical occur in the original thread.