Check out the LimeSurvey source code on GitHub!
Welcome, Guest
Username: Password:

TOPIC: Getting the sliderhandle to stay within the "sliderlane"

Getting the sliderhandle to stay within the "sliderlane" 3 years 10 months ago #87782

  • adishardis
  • adishardis's Avatar
  • Online
  • Premium Lime
  • Posts: 69
  • Karma: 0
Hi,

the default behaviour of the jquery ui slider handle is to have its middle at the edge of the "sliderlane". I however want the entire handle to stay within the lane at the endpoints.

Here (stackoverflow.com/questions/3707228/jque...-handle-modification)is a suggestion on how to solve it but I am not sure on how implement it in Limesurvey. :-/

Anyone got any suggestions?

Take care
Adam
The administrator has disabled public write access.

Getting the sliderhandle to stay within the "sliderlane" 3 years 10 months ago #87837

  • DenisChenu
  • DenisChenu's Avatar
  • Offline
  • Moderator Lime
  • Posts: 9346
  • Thank you received: 1338
  • Karma: 386
Hello,

Think you can use a multi numeric question type (without slider) and use your own slider launcher ith you own option and css.

LS inclde jquery, and included parameters use jquery, but sometimes is best to use your own jquery script :)
Assistance on LimeSurvey forum and LimeSurvey core developpement are on my free time (Say thanks ?).
A bug not reported is a bug not corrected. | Please, read the documentation | La doc en français à besoin de vous
The administrator has disabled public write access.

Getting the sliderhandle to stay within the "sliderlane" 3 years 10 months ago #87852

  • adishardis
  • adishardis's Avatar
  • Online
  • Premium Lime
  • Posts: 69
  • Karma: 0
Here's what I did, don't know if it's the best solution but it seems to do the job!

A warning though, I got som errors regarding em-manager for some reason but It dissapeared when I logged out and logged in again, but If someone knows why this solution is the wrong way to do it let me know!

To change the Multi-numerical slider I inserted an extra div <div id=myslider> in limesurvey/application/helpers/qanda_helper.php in line 3452 just before <div id=\"slider-$myfname\" class=\"ui-slider-1\">.

Code display:
                . "<div id=\"MySlider\" /><div id=\"slider-$myfname\" class=\"ui-slider-1\">\n"
                .  $slider_showmin
                . "<div class=\"slider_callout\" id=\"slider-callout-$myfname\"></div>\n"
                . "<div class=\"ui-slider-handle\" id=\"slider-handle-$myfname\"></div>\n"
                . $slider_showmax
                . "\t</div></div>"
                . "</div>$sliderright\n"
                . "<input class=\"text\" type=\"text\" name=\"$myfname\" id=\"answer$myfname\" value=\"";

and then in Template.css I added the id Myslider and included the background image:

#MySlider{
background-image:url(sliderBG3.png);
text-align:center;
background-repeat:no-repeat;
height:51px;
width:486px;
}

and lastly I removed the default bg for the slider and changed the width like this:

.ui-slider-1 {
width: 445px;
height: 51px;
margin-bottom: 20px;
}

I also changed the handler button:

.ui-slider .ui-slider-handle {
position: absolute;
height: 70px;
width: 70px;
top: -6px;
left: 0;
margin-left: -15px;
background: transparent url(sliderknapp3.png) 0 0 no-repeat;
border-width: 0;
}

I think that was it and everything is working like a charm!

Cheers
/Adam
Last Edit: 3 years 10 months ago by adishardis. Reason: fixed spelling
The administrator has disabled public write access.
Time to create page: 0.511 seconds
Imprint                   Privacy policy                  Revocation information and revocation form