[pmwiki-devel] toggling content

Petko Yotov 5ko at 5ko.fr
Sat Jun 6 13:13:50 PDT 2020


You may simply need the new details+summary block markup:

   https://www.pmwiki.org/wiki/PmWiki/BlockMarkup

   (:details summary="Show alert...":)
   Alert 1 text
   Alert 2 text
   (:detailsend:)

It shows an arrow that changes direction when the element is toggled. It 
doesn't require JavaScript to work. The elements can be styled with CSS.

This would be the easiest, and most future-proof way to do it.

If the arrow is not enough for you to show that the element can be open 
and closed, you can add the Show and Hide words with CSS:

   (:details class=showhide summary="alert":)

pub/local.css:
   details.showhide summary::before { content: "Show "; }
   details.showhide[open] summary::before { content: "Hide "; }

Note: the summary="..." attribute will be better left without any inline 
markup (future-proof).




If you must have one link to open several blocks, I'd see the ToggleNext 
core feature:

   https://www.pmwiki.org/wiki/Cookbook/ToggleNext

It requires JavaScript to be enabled. On the talk page I explained how I 
have a "toggle all" link that opens all sections:

   https://www.pmwiki.org/wiki/Cookbook/ToggleNext-Talk

It is can be seen in action here: https://virtour.fr/faq/ .

The show/hide words are indeed shown and hidden by CSS when appropriate.

Untoggle can do the "toggle next" part but not the "toggle all" part.

Petko

On 06/06/2020 01:58, Simon wrote:
> I'm writing a recipe where I wish to toggle content,
> and rather than implement another toggle or upload another javascript 
> I'd
> like to utilise something already built in, or available in PmWiki
> 
> For example I've looked at 
> https://www.pmwiki.org/wiki/Cookbook/UnToggle
> 
> My requirements are along the lines of:
> 
> <p class="alerthead"><span class="hideme">Hide</span><span
> class="showme">Show</span> alert</p>
> 
> <p class="alertbody showme">Alert 1 text</p>
> 
> <p class="alertbody showme">Alert 2 text</p>
> 
> When I click on the alert head I'd like to toggle the display of the 
> alerts
> on and off



More information about the pmwiki-devel mailing list