[Date Prev] | [Thread Prev] | [Thread Next] | [Date Next] -- [Date Index] | [Thread Index] | [List Home]
Subject: RE: [docbook] Showing/Hiding QandA answers
Sure, here is a non-working example. The basic idea is some object would
have an onclick attribute to call showAnswer(id), where id is the xml:id
of the answer. The idea for the answer is being placed in an anchor tag
rather than around the answer, so even if the onclick functionality
worked, it wouldn't target the right object.
Given this docbook input:
<qandaset xml:id='qa' defaultlabel='number'>
<qandaentry>
<question><para>2 + 4 = ?</para></question>
<answer><para role='hiddenanswer'
xml:id='a1'>6</para></answer>
</qandaentry>
<qandaentry>
<question><para>8 - 4 = ?</para></question>
<answer><para role='hiddenanswer'
xml:id='a2'>4</para></answer>
</qandaentry>
</qandaset>
With this html output (non-relevent html removed for brevity):
<table border="0" width="100%" summary="Q and A Set">
<col align="left" width="1%" />
<col />
<tbody>
<tr class="question" title="1.">
<td align="left" valign="top">
<a id="id284838"></a>
<a id="id284837"></a>
<p>
<strong>1.</strong>
</p>
</td>
<td align="left" valign="top">
<p>2 + 4 = ?</p>
</td>
</tr>
<tr class="answer">
<td align="left" valign="top"></td>
<td align="left" valign="top">
<p class="hiddenanswer"><a id="a1"></a>6</p>
</td>
</tr>
<tr class="question" title="2.">
<td align="left" valign="top">
<a id="id284842"></a>
<a id="id284840"></a>
<p>
<strong>2.</strong>
</p>
</td>
<td align="left" valign="top">
<p>8 - 4 = ?</p>
</td>
</tr>
<tr class="answer">
<td align="left" valign="top">
<a id="a2"></a>
</td>
<td align="left" valign="top">
<p class="hiddenanswer">4</p>
</td>
</tr>
</tbody>
</table>
This was transformed using this stylesheet:
<?xml version='1.0'?>
<xsl:stylesheet xmlns:xsl='http://www.w3.org/1999/XSL/Transform'
xmlns:d='http://docbook.org/ns/docbook' exclude-results-prefixes='d'
version='1.0'> <xsl:import
href='/usr/share/sgml/docbook/xsl-ns-stylesheets/xhtml/onechunk.xsl' />
<xsl:template name="user.head.content">
<script src="docbok.js" type="text/javascript"></script>
</xsl:template> </xsl:stylesheet>
docbook.js:
function showAnswer(id) {
if (document.getElementById(id).style.display=='block'){
document.getElementById(id).style.display = 'none';}
else {
document.getElementById(id).style.display = 'block';}
docbook.css:
.hiddenanswer {
display: none;
}
Output created using xsltproc. The only params set were for the
stylesheet and indented output.
-----Original Message-----
From: Bob Stayton [mailto:bobs@sagehill.net]
Sent: Wednesday, January 25, 2012 3:49 PM
To: DocBook Apps; David Goss
Subject: Re: [docbook] Showing/Hiding QandA answers
[redirecting this to the docbook-apps mailing list where stylesheet
issues are discussed]
Hi David,
I get the general idea, I'm not completely clear on the specifics here.
Can you provide a short sample of the question/answer DocBook input and
what you want its HTML output to look like? Are you using any of the
qanda stylesheet params, such as qanda.defaultlabel?
Bob Stayton
Sagehill Enterprises
bobs@sagehill.net
----- Original Message -----
From: "David Goss" <dgoss@mueller-inc.com>
To: <docbook@lists.oasis-open.org>
Sent: Tuesday, January 24, 2012 9:33 AM
Subject: [docbook] Showing/Hiding QandA answers
Hello,
I am trying to replace the answers of QandA sets in HTML output to hide
by default and only show when the user clicks a "show answer" link. This
is trivial to do with HTML/Javascript:
<html>
<head>
<style type="text/css">
.answer {display: none;}
</style>
<script type="text/javascript">
function showAnswer(id) {
if
(document.getElementById(id).style.display=='block'){
document.getElementById(id).style.display = 'none';}
else {
document.getElementById(id).style.display = 'block';}
}
</script>
</head>
<body>
What is on my desk? <a href='#' onclick="showAnswer('a1');">show
answer</a><span class='answer' id='a1'></span>
</body>
</html>
To get this output in docbook->HTML, I've added this to my stylesheet
template:
<xsl:template name="user.head.content">
<script src="myscript.js" type="text/javascript"></script>
</xsl:template>
In the docbook source, I've change the role of answer to "hidden-answer"
and change the display type for .hidden-answer to none in my CSS.
Now to get the onclick="showAnswer(a1)" part into links. The HTML output
sets an empty anchor tag with the answer's id next to it, but not around
it. This is the part where I'm stuck...
Maybe there's a better way to accomplish this using a template on
answers?
DAVID GOSS | Technical Writer
P 1.800.876.9218 x 345 | F 1.800.588.9866
dgoss@mueller-inc.com
http://www.MuellerReports.com
---------------------------------------------------------------------
To unsubscribe, e-mail: docbook-unsubscribe@lists.oasis-open.org
For additional commands, e-mail: docbook-help@lists.oasis-open.org
[Date Prev] | [Thread Prev] | [Thread Next] | [Date Next] -- [Date Index] | [Thread Index] | [List Home]