Is there a template with a CSS popup for the question-mark explanation text?

More
5 years 9 months ago #85181 by blanka
blanka created the topic: Is there a template with a CSS popup for the question-mark explanation text?
I was puzzling to give the survey a cleaner look. I was wondering if it is possible to move the explanation of a question to a CSS popup instead of showing it below the question? Is there a template that does this?

Please Log in or Create an account to join the conversation.

More
5 years 9 months ago - 5 years 9 months ago #85203 by DenisChenu
DenisChenu replied the topic: Is there a template with a CSS popup for the question-mark explanation text?
Hello,

Not included in default template. But you can do something with this kind of HTML/CSS:
question.pstpl:
<div {QUESTION_ESSENTIALS} class="question-wrapper {QUESTION_CLASS}{QUESTION_MAN_CLASS}{QUESTION_INPUT_ERROR_CLASS}">
	<div class="question-text">
		<span class="asterisk">{QUESTION_MANDATORY}</span><span class="qnumcode">{QUESTION_NUMBER} {QUESTION_CODE} </span>{QUESTION_TEXT}
	</div>
        <div class="showhelp">Show the help
	<div class="question-help">
		{QUESTIONHELP}
	</div>
        </div>
	<div class="help-wrapper">
		<div class="mandatory error">{QUESTION_MAN_MESSAGE}</div>
		{QUESTION_VALID_MESSAGE}
		<div class="tip">{QUESTION_HELP}</div>
	</div>
	<div class="answers-wrapper">
		{ANSWER}
	</div>
</div>
(adapted from citronade)
.showhelp{position:relative;}
.question-help{position:absolute;top:0;left:-99999em;with:20em;}
.showhelp:hover .question-help{position:absolute;top:1em;left:0}

It's a quick not tested solution, and you need some js for IE6/7. But you can do what you want with some HTML/CSS skills.

Denis

Assistance on LimeSurvey forum and LimeSurvey core development are on my free time.
I'm not a LimeSurvey GmbH member, professional service on demand (or search sondages pro).
An error happen ? Before make a new topic : remind the Debug mode .
Last Edit: 5 years 9 months ago by DenisChenu.

Please Log in or Create an account to join the conversation.

Start now!

Just create your account and start using Limesurvey today.

Register now
Join our Newsletter!