Use anchors in the table of contents of custom documentation

5 vues (au cours des 30 derniers jours)
Flyonurown
Flyonurown le 3 Oct 2017
Modifié(e) : Sebastian Winter le 23 Nov 2023
Hi,
I am making a custom documentation in Matlab (using the official procedure here ).
In the helptoc.xml defining the table of contents to show on the left side menu, I would like to add links to anchors in page, to be able to navigate directly to a specific section of the page : instead of just targeting a "mainpage.html", I would like to target "mainpage.html#title1".
For example, a minimalist page "mainpage.html":
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Title</title>
</head>
<body>
<h1 id="title1">title1</h1>
<p>...content 1...</p>
<h1 id="title2">title2</h1>
<p>...content 2...</p>
</body>
</html>
And the associated helptoc.xml :
<?xml version='1.0' encoding="utf-8"?>
<toc version="2.0">
<tocitem target="mainpage.html">Main page
<tocitem target="mainpage.html#title1">Direct link to Title1</tocitem>
<tocitem target="mainpage.html#title2">Direct link to Title2</tocitem>
</tocitem>
</toc>
When I do this, it works well : clicking on "Direct link to Title2" on the left side menu brings directly to the "title2" of the html.
But as soon as I specify an external CSS to style the html page, the anchors don't work any more : clicking on a direct link just displays the top of the page. I doesn't seem to depend on the CSS content, because even when I use an empty CSS, it breaks the direct link.
The links that are inside the html page itself (as internal links) still work.
Any idea or workaround to achieve this ? Is there a "correct / planned" way to link to a section of a page from the integrated TOC when creating custom documentation ?
Thank you very much.
Christophe
Matlab R2016b 64-bits, Debian 8.9
  2 commentaires
Peter
Peter le 23 Déc 2020
Just checking to see if a solution to this was found.. I'm seeing the same behavior.
Sebastian Winter
Sebastian Winter le 23 Nov 2023
Modifié(e) : Sebastian Winter le 23 Nov 2023
I ran into the same issue. My solution was to use some java-script and css (tested with R2020a and R2023a under windows):
After adding jquery to the html page the following code should do the trick:
hash = "NOT_SET";
function resetHash() {
if (hash != "") {
hash = hash.substr(1);
el = document.getElementById(hash);
el.scrollIntoView({ block: "center" });
el.classList.add("markedHeading");
}
else {
window.location.hash = hash;
}
}
$(document).ready(function() {
if(hash == "NOT_SET") {
hash = window.location.hash;
setTimeout(() => resetHash(), 1);
}
});
I manually scroll 1ms after the page is ready the requested item into view. Normally, you would not use { block: "center" } but top. But then, the jump point would be below the blue bar at the top of the documentation window. That's why i use the center.
Since this is not the standard way to do it I add the CSS class markedHeading which sets the background of the heading to blue and fades out the background color in the next 2 seconds:
/* hack for matlab when jumping to somewhere */
.markedHeading {
animation: markedHeadingAnimation 2s;
}
@keyframes markedHeadingAnimation {
from {background-color: lightblue;}
to {background-color: transparent;}
}
I know it's not perfect, but the best I could come up with.

Connectez-vous pour commenter.

Connectez-vous pour répondre à cette question.

Réponses (0)

Catégories

En savoir plus sur MATLAB Mobile Fundamentals dans Help Center et File Exchange

Tags

Community Treasure Hunt

Find the treasures in MATLAB Central and discover how the community can help you!

Start Hunting!

Translated by