Take the 2-minute tour ×

How to use Tooltips with JQM Sliders? I would like to add Tooltips to my JQM Ranges (e.g. 1-5), saying at what point the ui-slider-handle is positioned ("Your choice: 3"). I've tried qTip:

 $('#content a[href]').qtip({
      content: 'i am a qtip'

but it does not work on my mobile device. I would like to let the user know which choice he has made (before he gets off the screen with his thumb).

share|improve this question
add comment

1 Answer

There is an extension for jQuery Mobile that provides this functionality that can be found here

What you will do:

  1. Add a data attribute of data-popup-enabled="true" to your input element to display the tooltip.
  2. Copy the JavaScript code on the site and add it to your solution
  3. Copy the CSS ruleset on the site and add it to your solution.

Here's an example of how your input element for the slider should look:

<input type="range" name="slider-1" id="slider-1" min="0" max="100" value="50" data-popup-enabled="true">
share|improve this answer
add comment

Your Answer


