Back to limesurvey.org

Welcome to the LimeSurvey Community Forum

Ask the community, share ideas, and connect with other LimeSurvey users!

Change slider handle as slider value changes

More
6 years 9 months ago #176454 by tpartner
Replied by tpartner on topic Change slider handle as slider value changes

For example : if slider have 5 value : need a system to choose emoji.

I would use question attributes/settings to define the emoji break points so they could be adjusted for any slider scale.
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
The topic has been locked.
More
6 years 9 months ago #176457 by DenisChenu
Replied by DenisChenu on topic Change slider handle as slider value changes
Oh, personnaly : i mean : if we have 5 answers : need 5 settings, if 11 answers : need 11 settings etc …

I think of arrayTextAdapt in question template for example : www.limesurvey.org/index.php?option=com_...textadapt&Itemid=729

I think it's a good candidate, but don't find how to setbeasily the params (except with a textarea and some explode("|',value-in-param) or something other .
Assistance on LimeSurvey forum and LimeSurvey core development are on my free time.
I'm not a LimeSurvey GmbH member. - Professional support - Plugins, theme and development .
I don't answer to private message.
The topic has been locked.
More
6 years 9 months ago #176462 by tpartner
Replied by tpartner on topic Change slider handle as slider value changes
I would limit it to 5 emojis but let the admin select where they change.
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
The topic has been locked.
More
6 years 9 months ago #176475 by rickanderson
Replied by rickanderson on topic Change slider handle as slider value changes
The emoji is currently just a background image on the custom slider:
Code:
 
.slider .slider-handle.custom::before {
  display: inline-block;
  width: 20px;
  height: 20px;
  margin-top: 5px;
  margin-left: 5px;
  border-radius: 20px;
  background: transparent url(../files/slider00.png) center center no-repeat;
  background-size: cover;
  content: '';
}
 

with slider images (see attachment - probably not final images but for testing)



I haven't had time so far but I'm hoping to just read the slider value and update the background image appropriately.

Let me know if you require any further info or if you think there may be a better approach.

Cheers

...Rick.
The topic has been locked.
More
6 years 9 months ago - 6 years 9 months ago #176498 by DenisChenu
Replied by DenisChenu on topic Change slider handle as slider value changes

rickanderson wrote: I haven't had time so far but I'm hoping to just read the slider value and update the background image appropriately.

Yes, maybe only need update class , something like :
Code:
$(this).closest(".answer-item").find(".slider-handle").removeClass("emoji-1 emoji-2 emoji-3 emoji-4 emoji-5 emoji-6 emoji-7 emoji-8 emoji-9 emoji-10").addClass("emoji-"+$(this).value());
Assistance on LimeSurvey forum and LimeSurvey core development are on my free time.
I'm not a LimeSurvey GmbH member. - Professional support - Plugins, theme and development .
I don't answer to private message.
Last edit: 6 years 9 months ago by DenisChenu. Reason: typo
The following user(s) said Thank You: rickanderson
The topic has been locked.
More
6 years 9 months ago #176566 by rickanderson
Replied by rickanderson on topic Change slider handle as slider value changes
Seems to be working a treat with following:
Code:
$(this).closest(".slider-item").find(".slider-handle").removeClass("emoji0 emoji1 emoji2 emoji3 emoji4 emoji5 emoji6 emoji7 emoji8 emoji9 emoji10").addClass("emoji"+$(this).val());

Thanks again everyone for all your help.

Cheers

...Rick.
The topic has been locked.
Moderators: tpartner, holch

Lime-years ahead

Online-surveys for every purse and purpose

Pricing & Plans
Get started

Legal

About Us

Open Source