jQuery UI滑块上的动画拖动手柄 [英] jquery ui slider animation on dragging the handle

问题描述

我对jquery ui滑块有疑问，现在已经搜索了一段时间，但找不到有效的anwser.

I have a question about the jquery ui slider, have been searching for a while now but can not find a working anwser.

对于一个项目，我正在使用 http://jqueryui.com/demos/slider/#steps jQuery ui Slider. 它运作良好，可以完成大部分工作.

For a project I am using the http://jqueryui.com/demos/slider/#steps jQuery ui Slider. It works well and gets most of the stuff done.

我使用250步，当用户单击例如250或500时，滑块手柄将动画/滑动到该值.

I use steps of 250 and when a user clicks on e.g 250 or 500 the slider handle animates/slides to the value.

但是，当用户握住(拖动)手柄并将其手动拖动时，它不会使步骤动画或滑动，而只是非常难看到下一个值.

But when a user is holding(dragging) the handle and drags it manually it does not animate/slide the steps but just goes to the next value very ugly.

有人知道当用户手动握住手柄而不是单击一些预定义的值时如何使手柄动画/滑动吗?

Does anyone know how to make the handle animated/sliding when a user is holding it manually instead of clicking on some predefined values?

谢谢！

推荐答案

jQuery UI Slider(版本1.9.2)不支持拖动动画.您必须更改我认为的库代码.

The jQuery UI Slider(version 1.9.2) doesn’t support dragging animation. You have to change the library code I think.

这是补丁javascript代码

Here is the patch javascript code

    (function( $, undefined ) {

        $.extend($.ui.slider.prototype.options, {
            dragAnimate: true
        });

        var _mouseCapture = $.ui.slider.prototype._mouseCapture;
        $.widget("ui.slider", $.extend({}, $.ui.slider.prototype, {
            _mouseCapture: function(event) {
                _mouseCapture.apply(this, arguments);
                this.options.dragAnimate ? this._animateOff = false : this._animateOff = true;
                return true;
            }
        }));

    }(jQuery));

这是详细信息. http://www.markliublog.com/jquery-ui-slider-dragging -animate.html

这篇关于jQuery UI滑块上的动画拖动手柄的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！