Reputation: 77
i use this plugin for my website:
http://codenegar.com/woocommerce-ajax-product-filter/shop/
The range slider at the right side (Filter by Price, Camera etc.) works well on mouse based systems, but its horrible to use on touch devices like iPhones, iPads, Androids... You can't drag it by touch.
How can I make this plugin work in touch devices?
Upvotes: 2
Views: 5770
Reputation: 26
To Enable Touch action you include jQuery touch punch js
Include jQuery and jQuery UI on your page.
<script src="jquery-1.7.2.min.js"></script>
<script src="jquery-ui.min.js"></script>
<script src="jquery.ui.touch-punch.min.js"></script>
Upvotes: 0
Reputation: 1360
noUISlider is a cross-browser, cross-platform and cross-device library that works out of the box and is more lightweight than jQuery UI + touchpunch.
Upvotes: 3
Reputation: 7468
You can use jquery range slider in touch devices by using jQuery UI Touch Punch.
Using Touch Punch is as easy as 1, 2… Just follow these simple steps:
Include jQuery and jQuery UI on your page.
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script src="http://code.jquery.com/ui/1.8.21/jquery-ui.min.js"></script>
Include Touch Punch after jQuery UI and before its first use.
<script src="jquery.ui.touch-punch.min.js"></script>
Upvotes: 3