Welcome to the LimeSurvey Community Forum

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

Change slider handle as slider value changes

  • DenisChenu
  • DenisChenu's Avatar
  • Offline
  • LimeSurvey Community Team & Official Partner
  • LimeSurvey Community Team & Official Partner
More
6 years 2 weeks ago #176421 by DenisChenu
Replied by DenisChenu on topic Change slider handle as slider value changes

rickanderson wrote: I'm managing to access the slider values using your code (I had to change $(this).value() to $(this).val()) so should now be able to use these to customise the slider handles, fantastic!

Thanks, just for information (and other user) : how do you manage the emoji ? With class ?

Can you pit your snippet here ? (and maybe in our workaround in manual).

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.
  • tpartner
  • tpartner's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
6 years 2 weeks ago #176434 by tpartner
Replied by tpartner on topic Change slider handle as slider value changes
Or, even better, a custom question theme. :)

Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
The topic has been locked.
  • DenisChenu
  • DenisChenu's Avatar
  • Offline
  • LimeSurvey Community Team & Official Partner
  • LimeSurvey Community Team & Official Partner
More
6 years 2 weeks ago #176441 by DenisChenu
Replied by DenisChenu on topic Change slider handle as slider value changes

tpartner wrote: Or, even better, a custom question theme. :)

Yes, but it's hard to do a global theme.

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

Here : i think it can be an attribute in plugin, i don't think we need a complete question theme :). Then if core update : attribute can still live with the new feature ready.

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.
  • tpartner
  • tpartner's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
6 years 1 week 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.
  • DenisChenu
  • DenisChenu's Avatar
  • Offline
  • LimeSurvey Community Team & Official Partner
  • LimeSurvey Community Team & Official Partner
More
6 years 1 week 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.
  • tpartner
  • tpartner's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
6 years 1 week 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.
  • rickanderson
  • rickanderson's Avatar Topic Author
  • Offline
  • Junior Member
  • Junior Member
More
6 years 1 week 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.
Attachments:
The topic has been locked.
  • DenisChenu
  • DenisChenu's Avatar
  • Offline
  • LimeSurvey Community Team & Official Partner
  • LimeSurvey Community Team & Official Partner
More
6 years 1 week ago - 6 years 1 week 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 1 week ago by DenisChenu. Reason: typo
The following user(s) said Thank You: rickanderson
The topic has been locked.
  • rickanderson
  • rickanderson's Avatar Topic Author
  • Offline
  • Junior Member
  • Junior Member
More
6 years 1 week 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: tpartnerholch

Lime-years ahead

Online-surveys for every purse and purpose