How to use Jquery UI Slider on Windows Surface?

Question

I am working on an application for Windows surface and I am trying to use the Jquery UI slider. It works for mouse events, but does not work for touch.

I looked at this question here and tried its solutions, but it does not work. (Used both jquery-ui-touch-punch and

-ms-touch-action: none;
touch-action: none;

but none of them work).

Is there any other solution for this?

I am using Chromium Portable to run the application and using 1.11.4 jquery ui and jQuery UI Touch Punch 0.2.3.

Answer 1

Based on your question, I setup the following demo w/Touch Punch:

https://jsfiddle.net/Twisty/fLudwu2b/

JQUERY

$(function() {
  $("#red, #green, #blue").slider({
    orientation: "horizontal",
    range: "min",
    max: 255,
    value: 127,
    slide: refreshSwatch,
    change: refreshSwatch
  });
  $("#red").slider("value", 255);
  $("#green").slider("value", 140);
  $("#blue").slider("value", 60);
});

I tested the demo with a Surface Device using IE. It appears to work.

I would advise checking or updating your test environment and ensure that the latest JavaScript is available in the browser.