Home/ Questions/Q 6725943
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-26T09:52:03+00:00

I’m trying the slider widget in jQuery Mobile, and just copied the code from

  • 0

I’m trying the slider widget in jQuery Mobile, and just copied the code from the docs:

    <div data-role="fieldcontain">
        <label for="slider">Input slider:</label>
        <input type="range" name="slider" id="slider" value="0" min="0" max="100"/>
    </div>

But this doesn’t work as expected at all. When I drag the slider in Safari the numbers change almost randomly. They increase from 0 to 9 and then at the far right of the slider it goes back to 0, and then when I slide back it goes back and forth between 0 and 9…

Am I doing something wrong??

I am using this inside a CodeIgniter application.

EDIT:

I just found out that it actually works when live on the iPhone, but not in Safari on the desktop. It’s still weird, because first of all I need it to work on the desktop for development, and secondly, it works on the jQuery Mobile demo site… I have tried looking at that code, and even copying it exactly, but still it doesn’t work on my page.

I have updated to RC2, while the script on the demo page is still beta 2, could that be it?

EDIT 2:

No, that was not it… I had checked the old docs, but the example in the new docs with the latest release worked fine on their demo page as well. So it’s something else.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Sort of found the answer myself. The jQuery Mobile stylesheet when I looked in the web inspector in Safari had set the width of the input field to 50px. If I increased that to 70px I noticed that the values were in fact increasing, it was just that I only saw the left digit before. Strangely, it seems to be working fine on their demo site, even though the same stylesheet is used! Anyway, I got it working by overriding that rule and setting it to 70px.

    • 0