0

I am using MJQuery slider. The step increment in the slider is not working when i am using Mobile JQuery. however, it is working for the normal version This is version of the page without using mobile JQuery. In this case you cannot position slider control at any point in the range.

http://users.ecs.soton.ac.uk/smaj08r/vidtest/indexNotMJQ.html

code:

<html>
<script src="jquery-1.8.3.js"></script>
 </head>
<body>
This is slider without MJQuery
 <input type="range" name="slider-step" id="slider-step" value="2" min="1" max="4" step="1" />
</body>
</html>

In the following version, I am using Mobile JQuery and here the Step Increment in the slider control is not working. You can position the slider at any intermediate point between two increments.

http://users.ecs.soton.ac.uk/smaj08r/vidtest/indexMJQ.html

code:

 <html><head>
 <script src="jquery-1.8.3.js"></script>
   <meta name="viewport" content="width=device-width, initial-scale=1"> 
   <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
   <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js">     
   </script>
</head><body>
<div data-role="page">
    <div data-role="content">
        <input type="range" name="slider-step" id="slider-step" value="20" min="0" max="100" step="20" />
 </div>
 </div>

  </body>
 </html>

In the mobile JQuery version the slider can be positioned at any point in the range which is wrong. I have no idea Why? Please Help. Many thanks,

smaj08r
  • 229
  • 3
  • 7
  • Your question is vague and I am not sure what you are looking for in the way of an answer? – andleer Jan 10 '13 at 19:03
  • @andleer Thank you very much. I have just updated the code as recommended but its still not working properly. Ofcourse the control is not taking any wrong values but the position of slider can still be in between any two desired positions. I want the slider only at desired 5 points which is the purpose of step-increment. Can you still see any problem. thanks, – smaj08r Jan 10 '13 at 20:02
  • As you can see at http://jquerymobile.com/test/docs/forms/slider/index.html the step increment slider, the slider can't be positioned at every position. it only stays at particular steps. – smaj08r Jan 10 '13 at 20:05
  • That is not the case with the current 1.2 version of jQuery Mobile. The 'test' docs are just that. It would be nice if they didn't show up in Google searches. You can find the live docs here: http://jquerymobile.com/demos/1.2.0/docs/forms/slider/ Notice that the slider does not behave as you have described. – andleer Jan 10 '13 at 21:09

2 Answers2

1

You are missing required jQuery Mobile markup:

<div data-role="page">
    <div data-role="content">
        <input type="range" name="slider-step"
            id="slider-step" value="2" min="1" max="4" step="1" />
    </div>
</div>

The slider looks OK. The step limits the values, not the slider. A step of 1 is somewhat meaningless.

andleer
  • 22,388
  • 8
  • 62
  • 82
0

That is not the case with the current 1.2 version of jQuery Mobile. The 'test' docs are just that. It would be nice if they didn't show up in Google searches. You can find the live docs here:

jquerymobile.com/demos/1.2.0/docs/forms/slider

Notice that the slider does not behave as you have described. – andleer

the actual behavior of slider using jquery mobile is different from this one.

jquerymobile.com/test/docs/forms/slider/index.html

smaj08r
  • 229
  • 3
  • 7