I'm trying to replicate the above onto a Confluence page, with the content pulled from labels. Here's the original webpage - https://www.anu.edu.au/directories/university-glossary
Is there any way to do it, or should I just forget about it and use a live search function instead, and get the user to start typing what they are looking for?
Thanks in advance,
Kathryn.
Back in the early 2010s, I wrote a Confluence macro called azList which did just this.
Here's a video of it in action (though sadly no longer maintained):
https://www.youtube.com/watch?v=cElY-7mSwAs
It was based on the following jquery plugin:
https://github.com/dvdsmpsn/azList
It should be trivial to convert into a user macro for use on Confluence Server.
It would be a wrapper which inserts the following around an unordered list:
<div class="azList">$body</div>
Then adds the following javascript:
AJS.toInit(function($){
$.each($('.azList > ul'),function(index, value) {
$(this).attr('id', 'azList-'+index); // Add a unique id to each ul
$(this).azList();
});
});
And a sprinkling of CSS:
.azListIndex li {
display: inline;
padding: 0.2em;
}
.azListIndex li a {
background: #f0f0f0;
border-bottom: 1px solid #ccc;
padding: 0.1em 0.3em;
text-decoration:none;
}
.azListIndex a:hover {
background: #dedede;
border-bottom:1px solid #000;
}
.azListInitial {
list-style-type: none;
font-size:1.4em;
padding-top:0.6em;
background:none;
}
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.