As to links for the top and for other sections, as well...we had been using that type of structure, but found that too many links became overwhelming. We decided to only provide a Return to Top at the bottom of each scrollable topic.
However, I've since revisited the issue, and just yesterday worked up a scrolling (floating) link, which our team is now reviewing. We are considering whether to place this in addition to the current link, or instead of it. (Note the "z-index: 1;" setting in the .css file; that causes the link to always be layered over anything else on the page.)
It looks like this:
This is the code to be used within each topic and within your (MyProject).css file:
At the top of each topic (I have it just under the H1 heading)
<p class="top"><a class="topic" title="Return to Top" href="#">↑ Top</a></p>
In your .css style sheet file (place the p.top after the default p & LI.p settings, and the A.topic's after the default A settings)
Simply customize my settings to suit your organization's style and formatting needs (fonts, location, padding, border, etc.).
Thanks Leon. I followed the procedure you have mentioned. The Top link appears on the help page, but it does hover when I scroll down the page. It remains fixed at the position where I placed the <p class="top"><a class="topic" title="Return to Top" href="#">↑ Top</a></p> code. I have copied the p.top and A.topic properties to my CSS.
Am I doing something wrong?
My own notes...
Here are my own approaches when I need a Back to Top link. I insert a link that says "Back to top" and program it so the URL is quite simply a pound symbol (US - Hash symbol in the UK and elsewhere) #.
When clicked, the page simply reloads.
As a user, I would find it confusing if the link took me to the beginning of the section. I would typically expect it to take me to the top of the page instead.
errr...that's what it looks like in the source topic in the project. You should see the floating effect when you generate your WebHelp output.
...or, the .css file you edited is not the one actually assigned to this topic.
...or, you might not have copied everything to the .css file (such as a closing curly bracket, for example).
Thanks for the heads up. My bad for skimming the thread and not fully reading it so I saw your bit about the #.
Further my bad for not taking the time and testing your script to see it work. It seems that the only time I've ever seen the floating approach used it was herky jerky. So my question here is to ask about something you said. You said it was "smooth" HTML and CSS. Does this mean that the link DOES move with the page as you scroll it, then it "smoothly" glides back to a resting spot? I've seen this approach too. Admittedly it's better than the herky jerky repositioning, but I still find it to be a bit on the annoying side. It would be much better if it were simply positioned and locked to a certain page position.
Then again, I suppose it could also obscure parts of the text if that were the case.
Happy Fri.. errr... Thursday! Rick
The link does not move at all: as your preference states , it is "simply positioned and locked to a certain page position," (bottom right, as shown in my screenshot image). It's only the content that moves, or scrolls, behind it.