Hi all,

For an image validation study I would like to show one image per page with four questions displayed underneath the image. I would like to put the image and questions in such a way that the image is always seen (even if scrolling is necessary).

I can think of two ways of achieving this:
1) Trying to fit everything on one screen so that no scrolling is needed. This would be ideal, but as I have different question types the questions aren’t very concisely displayed. The first three questions are arrays but with different answering scales (all 7-point Likert scales, but with different descriptions), and as far as I know this makes it necessary to make them into different questions, which takes a lot of space. The last question is an optional open question. So my questions are: is it possible to put the three questions into one question (with different scales)? OR/AND: is it possible to make the space between the questions and the overall layout more concise?

2) Trying to make the image ‘sticky’. So the image is put in a comparison type of question at the moment, and I used a little code to make the image sticky in a way that if I scroll down the image scrolls down also and thus always stays on the screen. I wouldn’t mind this solution, but at the moment this isn’t very well executed by me: for some reason the image doesn’t start on the top in the center but on the left in the middle (already overlaying the question part). I would like for it to be displayed on top in the center and to only scroll down when I scroll down the whole screen to reach the questions not directly visible (consequently overlaying the first questions probably already filled in). My question here is: is there a way to make my little code work better (I copied the code underneath this question).

Attached: an screenshot of how it now looks like. To take this screenshot I zoomed out the screen to 80% so everything fit, and in this way the image actually doesn't overlap the questions, but is still not displayed on the top center.

Thanks in advance,
D

Code:
<style type="text/css">.center {
display: 0;
margin-left: top;
margin-right: top;
width: 500px;
position: fixed;
bottom: 100px;
left: 100px;
z-index: 999;
}
</style>
<img alt="" class="center" src="/limesurvey315/upload/surveys/674355/images/Cross_Neg-1.png" />

I would be inclined to use CSS to "merge" the questions - remove unnecessary white-space, borders and text elements.

What theme are you using?

Can you attach a small sample survey containing a single group of questions?

And you may do it like this you may improve by css.

Theme: "fruity"


Theme: "skelvanilla"


and here the script (of course: not mine, but Tony's)
Joffm

Some explanation:
Simple array
Subquestions use the pipe symbol:
SQ001: sterk negatief|sterk positief
SQ002: wenig intens|erg intens
...



And combined with another of Tony's solutions

Joffm wrote: …
Theme: "skelvanilla"
…

Thanks to use it

Else : skelvanilla allow class `skel-no-question` i must check what happen with array ?

And maybe add a `skel-question-as-tableheader` to move the question text like you do in the screenshot ? I think it can be possible … (+ a `skel-question-no-tableheader` maybe).

Hi all,

Thank you for the helpful comments. I’ve attached two small surveys containing a single group.

In the first small survey I attached, I applied the solution of Joffm (and Tony’s). This looks quite good already, certainly if you open the survey on a big monitor on which everything fits.

In the second small survey attached, I also tried the other solution of Joffm because I find this a very neat way of presenting the questions. Vertically everything fits perfectly. However, because my image is displayed larger (and reducing the size isn’t really an option for this study) the Likert scale does not fit well anymore (horizontally) and so the scale starts to overlap. Is there a way to broaden the template so there is more space for the question (+image) and rating scale (i.e. to reduce the white space around the question box)?

I’ve reduced the white space between the question and the image (<table border="0" cellpadding="0" cellspacing="0" width="100%"></table>), and I’m using the Vanilla theme.

Kind regards,
D

Please, do not attach lsq nor lsg exports, only lss.

lsq and lsq are language sensitive.
So we have to create a new survey, hopefully with the correct base language to be able to import your question or group.
And we are not sure to have all other settings of your survey.

Joffm

Thank you, I didn't know that. Attached you can find the .lss format.

Hi,
here is my survey.



Just to compare.

Joffm