Welcome, Guest
Username: Password: Remember me

TOPIC: align slider handle with backgroundimage

align slider handle with backgroundimage 2 years 5 months ago #79843

  • PsyStudent
  • PsyStudent's Avatar
  • OFFLINE
  • Fresh Lemon
  • Posts: 3
  • Karma: 0
Hi, I'm currently trying to implement the NASA-TLX for my survey.

The NASA-TLX is a "multidimensional assessment tool that rates perceived workload on six different subscales" (wikipedia).
Basically a scale of the NASA-TLX consists of 20 possible, in-lined positions, that lock like an array of cells (e.g. from "high" to "low")
The user has to place an cross/X at the position (in the cell) that fits him best.

I'm using a multi-num slider for the scale. I changed the backgroundimage of the scale and the image of the slider handle. I set the size settings according to the size of the picture.
The background is 400px wide and the slider handle 20px (20px * 20 positions = 400px scale). The first position of the slider handle starts with the scale on the left side and fits perfect to the cell-layout.
BUT there is a small problem I just can't solve.
The slider handle seems to make small "jumps" of 1px after each position. So it is not: 20px, 20px, 20px .... instead it is: 20px, 1px, 20px, 1px, ... Thus my slider handle crosses the end of my scale because there is a space of 1px between each position.

I've tried everything from changing the size of the images to setting all margins and borders = 0.

I attached a picture of the situation and changed the colour of the slider handle to red. If I would change the colour of the background, you could see that the slider handle crosses also the end of the coloured background (so it is not my image, i guess). But I wantet you to see the design of the scale too, so I just changed the slider handle.

(I hope my English isn't to bad. I'm from Germany)

I would be happy for every hint or solution.

Thanks.
Attachments:
The administrator has disabled public write access.

Re: align slider handle with backgroundimage 2 years 5 months ago #79984

  • tpartner
  • tpartner's Avatar
  • OFFLINE
  • LimeSurvey Team
  • Posts: 4281
  • Thank you received: 807
  • Karma: 370
Can you activate a sample survey?
Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.

LimeSurvey is open-source and run entirely by volunteers so please consider donating to support the project.
The administrator has disabled public write access.

Re: align slider handle with backgroundimage 2 years 5 months ago #80102

  • Mazi
  • Mazi's Avatar
  • OFFLINE
  • LimeSurvey Team
  • Posts: 5333
  • Thank you received: 296
  • Karma: 249
Can't you just change the general slider width using CSS?

Best regards/Beste Grüße,
Dr. Marcel Minke
(Limesurvey Head of Support)
Need Help? We offer professional Limesurvey support
Contact: marcel.minke(at)limesurvey.org'"
The administrator has disabled public write access.

Re: align slider handle with backgroundimage 2 years 5 months ago #80181

  • PsyStudent
  • PsyStudent's Avatar
  • OFFLINE
  • Fresh Lemon
  • Posts: 3
  • Karma: 0
Hi,
sorry for the late answer.
No, unfortunately I can't activate a sample survey.
But I can upload my template.css, the complete .zip-template (a copie of default including all images) and the exported .lss-file of my survey.
I only made changes at the end of the template.css and added some jquery modifications in the "Question" section of the questions (concernig the visability of the slider handle).

I'm not really in IT, so I had to copy and tailor a lot of stuff.

Thanks a lot for answering.
Attachments:
The administrator has disabled public write access.

Re: align slider handle with backgroundimage 2 years 5 months ago #80194

  • Mazi
  • Mazi's Avatar
  • OFFLINE
  • LimeSurvey Team
  • Posts: 5333
  • Thank you received: 296
  • Karma: 249
Mazi wrote:
Can't you just change the general slider width using CSS?
^- Did you try that?

Best regards/Beste Grüße,
Dr. Marcel Minke
(Limesurvey Head of Support)
Need Help? We offer professional Limesurvey support
Contact: marcel.minke(at)limesurvey.org'"
The administrator has disabled public write access.

Aw: align slider handle with backgroundimage 2 years 5 months ago #80261

  • PsyStudent
  • PsyStudent's Avatar
  • OFFLINE
  • Fresh Lemon
  • Posts: 3
  • Karma: 0
Yes, I tried it.
There was still a space between each slider position.

I really don't know what else I can do to make it work.
Does anybody know what could be the reason for a 1px space between the slider positions??? It also seems like that the space is only on the right side of the slider handle, because the slider handle starts at the same px like the scale.
The administrator has disabled public write access.

Re: Aw: align slider handle with backgroundimage 2 years 5 months ago #80317

  • Mazi
  • Mazi's Avatar
  • OFFLINE
  • LimeSurvey Team
  • Posts: 5333
  • Thank you received: 296
  • Karma: 249
Hard to say what goes wrong here...

One probably needs to take a look at the source code to find out, but that's a little beyond the free support we can offer, especially since you also did some major CSS/template modifications.

Best regards/Beste Grüße,
Dr. Marcel Minke
(Limesurvey Head of Support)
Need Help? We offer professional Limesurvey support
Contact: marcel.minke(at)limesurvey.org'"
The administrator has disabled public write access.
Moderators: ITEd
Time to create page: 0.130 seconds
Donation Image