Welcome, Guest
Username: Password: Remember me
  • Page:
  • 1
  • 2

TOPIC: vertical slider

vertical slider 3 months 3 weeks ago #107291

I'm sorry but that did not make any difference...?
The administrator has disabled public write access.

Re: vertical slider 3 months 3 weeks ago #107293

  • tpartner
  • tpartner's Avatar
  • OFFLINE
  • LimeSurvey Team
  • Posts: 4069
  • Thank you received: 747
  • Karma: 341
Try with these - I have just successfully imported them into a fresh instance of 2.05.

File Attachment:

File Name: Demo_Vertical_Sliders_3.zip
File Size: 75 KB


File Attachment:

File Name: limesurvey_survey_51234.lss
File Size: 23 KB
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.
The following user(s) said Thank You: fvanderstarre

vertical slider 3 months 3 weeks ago #107299

Great! Thx...
How can I change the slider background color (not the handle but the slider itself)?
The administrator has disabled public write access.

vertical slider 3 months 3 weeks ago #107304

  • tpartner
  • tpartner's Avatar
  • OFFLINE
  • LimeSurvey Team
  • Posts: 4069
  • Thank you received: 747
  • Karma: 341
Add something like this to the end of template.css:

.ui-slider.vertical-slider {
	background: none pink;
}
 
.ui-slider.vertical-slider .ui-slider-range {
	background: none red;
}

Capture_2014-04-08.png
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.

vertical slider 3 months 5 days ago #107907

Now I'd like to make the slider look like a thermometer.
We use a javascript workaround for that in our current setup (1.90), see below and attached image.
I haven't been able to work out how to do it your way though.....
Any help much appreciated!

thermo_slider.jpg


<script type="text/javascript" charset="utf-8">
var surveyid = 12185;

$(document).ready(function() {
// call the init slider routine for each element of the .multinum-slider class
$(".multinum-slider").each(function(i,e) {
var basename = e.id.substr(10);
$('#slider-'+basename).slider( "option", "range", "min" );
$('#slider-'+basename).slider( "option", "orientation", "vertical" );

var divTag1 = document.createElement("div");
divTag1.id = "slider-range-"+basename;
divTag1.className = "ui-slider-range ui-slider-range-min ui-widget-header";
document.getElementById("slider-"+basename).appendChild( divTag1 );

var divTag2 = document.createElement("div");
divTag2.id = "thermo1";
divTag2.className = "thermo";
divTag2.innerHTML = "<img src=\"/cru/upload/surveys/"+surveyid+"/thermo3.jpg\" alt=\"thermo\" />";
document.getElementById("container-"+basename).appendChild( divTag2 );
})
});
The administrator has disabled public write access.
  • Page:
  • 1
  • 2
Moderators: ITEd
Time to create page: 0.174 seconds
Donation Image