How to make "spoiler" text in github wiki pages?

Question

I'm trying to make text which is either invisible until moused over, or, has a "show" / "hide" button, or some other thing, so that it is not visible until the user interacts with it in some way.

I'm trying to do this on a github wiki page. (Specifically it's for a short self-quiz.)

Basically I want to get a similar effect to what SO achieves with the >! markup:

Hoho! Spoiler text!

as described in these meta posts.

The same markup doesn't work in github, I guess that it's an SO extension?

I saw this issue about using spoiler text in comments on github, which was closed, but I thought there might be a different answer for the wiki pages, or a different solution based on HTML or something?

Does anyone know if there's a way to do this, or if it is definitely unfortunately impossible?

Answer 1

GFM supports a subset of HTML. For now, you can wrap your question in a <summary> and your answer in any standard HTML tag like <p> and wrap the whole thing in the <details> tag.

So if you do this

<details>    <summary>Q1: What is the best Language in the World? </summary>    A1: JavaScript  </details> 

You get this -> https://github.com/gaurav21r/Spoon-Knife/wiki/Read-More-Test

Browser support is an Issue.

The thing with GitHUB wiki is that it allows you write text in other formats like AsciiDoc, RST etc. Probabaly there's solution in those too. These are 2 formats that are far more feature rich than Markdown.