Hello LS community,

I'm evaluating several survey tools for my master thesis and there is one unusual requirement. After searching the forum for a while, I decided to post this.


Participants are asked to predict NFL games. For each game they need to forecast the likelihood that the home or away team wins (multiple numeric input values between 0-100%). Obviously, the sum of the home and away team winning chances have to be 100% in total.

I figured out how to set the initial slider value to 50% and equals sum value helps to make sure the outcome predictions sum up to 100.

Here is where I struggle:
When a participant drags the slider for the home team away from its initial value of 50%, the away team slider should adjust itself accordingly (so that the sum is always 100%).

I really appreciate your help!

Thanks,
Gregor

Hm,

and why do you use two separate sliders?
In my opinion it is sufficient to use one.




You can use a bit more css to have the segments of the slider in different colors.


Joffm

Here is a custom question theme that demonstrates how to programmatically move sliders - github.com/tpartner/LimeSurvey-Pricing-Sliders-3.x

I agree with Joffm, why make it complicated, if you can simplify. At the end of the day the simplest solution in your case is to use one slider with the two teams as extremes, then per definition the chances of one team are reduced when the chances of the other team are increased.

However, you'll have to move away from the 100% thingy, but you can always recalculate this value later, if you really need to have those values.

Thank you for the pointer. However, I do lack the skills to adapt the solution to my needs.

Thank you, Joffm. I'm doing some testing to see if I can make it work with one slider.

Is there a resource (like a cheatsheet) where I can look up all the CSS codes/ placeholder fields related to sliders?

Hi,
here you will find something
www.limesurvey.org/forum/design-issues/1...alize-sliders-design

I used additionally
And of course you may use a webdevelopment tool which is included in each modern browser.
Here you find the involved css classes:
e.g.


Best regards
Joffm

Thanks again, Joffm! I'll be looking more into css templates and how to adapt this for my needs.


How did you get the winning probabilities in the help text of the question? Was that by using placeholders?

How did you get the winning probabilities in the help text of the question? Was that by using placeholders?

Yes, the normal thing:
Plain:
Probability: Team A:{100-Q1_SQ001.NAOK}%, Team B: {Q1_SQ001.NAOK}%

With some css_
Probability: <span style="color:#d35400;">Team A:{100-Q1_SQ001.NAOK}%</span>, <span style="color:#1abc9c;">Team B: {Q1_SQ001.NAOK}%</span>

Joffm

Joffm wrote:

How did you get the winning probabilities in the help text of the question? Was that by using placeholders?

Yes, the normal thing:
Plain:
Probability: Team A:{100-Q1_SQ001.NAOK}%, Team B: {Q1_SQ001.NAOK}%

With some css_
Probability: <span style="color:#d35400;">Team A:{100-Q1_SQ001.NAOK}%</span>, <span style="color:#1abc9c;">Team B: {Q1_SQ001.NAOK}%</span>

Joffm

That helped a lot, thanks.

Is there a resource where I can loop up all the placeholder codes like NAOK or do I just have to know them? I could find any references in the manual.

Put on the glasses
manual.limesurvey.org/Expression_Manager...#Access_to_variables

Joffm