SlideUp / SlideDown Q&A or FAQs (no jQuery)
A Velocity-powered Q&A / FAQs script that reveals hidden answers in a slide-down / slide-up panel. The following actions can be performed within the same page or from another page using a hash;
- Open a single question
- Open all questions in a group
- Open all questions on a page
Works in modern browsers and IE8+ (no slideUp/ slideDown effect in IE8).
Please view the source of this page for HTML markup, CSS and JS.
Key Stage 3
-
Year 7
Year 7 students in England and Wales are;
- 11 years old
- 12 years old
Key Stage 3 is commonly abbreviated to KS3.
-
Year 8
Year 8 students in England and Wales are;
- 12 years old
- 13 years old
Key Stage 3 is commonly abbreviated to KS3.
-
Year 9
Year 9 students in England and Wales are;
- 13 years old
- 14 years old
Key Stage 3 is commonly abbreviated to KS3.
Key Stage 4
-
Year 10
Year 10 students in England and Wales are aged;
- 14 years old
- 15 years old
Key Stage 4 is commonly abbreviated to KS4.
-
Year 11
Year 11 students in England and Wales are aged;
- 15 years old
- 16 years old
Key Stage 4 is commonly abbreviated to KS4.
Key Stage 5
-
Year 12
Year 12 students in England and Wales are aged;
- 16 years old
- 17 years old
Key Stage 5 is commonly abbreviated to KS5.
-
Year 13
Year 13 students in England and Wales are aged;
- 17 years old
- 18 years old
Key Stage 5 is commonly abbreviated to KS5.
Open questions from another page
Click on links from another page to see how a single answer, a group of answers, or all answers on a page, can be opened via a hash at the end of an URL.
Open questions when the page loads
You can open a question panel when the page first loads with the "item-open" class and style="display:block" inline CSS;
<li>
<span class="qa-question item-open" data-goto-id="myid"> Question </span>
<div class="qa-answer" id="myid" data-goto-group="mygroup" style="display:block">
<!-- open panel Answer content here -->
</div>
<li>
Related
More demos and snippets
Did you find this useful? There are more demos and code snippets this way.