Use anchors in the table of contents of custom documentation

5 visualizaciones (últimos 30 días)
Flyonurown
Flyonurown el 3 de Oct. de 2017
Editada: Sebastian Winter el 23 de Nov. de 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 comentarios
Peter
Peter el 23 de Dic. de 2020
Just checking to see if a solution to this was found.. I'm seeing the same behavior.
Sebastian Winter
Sebastian Winter el 23 de Nov. de 2023
Editada: Sebastian Winter el 23 de Nov. de 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.

Iniciar sesión para comentar.

Iniciar sesión para responder a esta pregunta.

Respuestas (0)

Categorías

Más información sobre MATLAB Mobile Fundamentals en Help Center y File Exchange.

Etiquetas

Community Treasure Hunt

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

Start Hunting!

Translated by