如何使工具提示在jquery ui滑块中滑动多个手柄之前可见

时间:2018-08-23 11:15:50

标签: jquery django jquery-ui-tooltip

enter image description here在滑动手柄iam时使用ui.value获取工具提示,但是在滑动iam时未获取工具提示之前,我希望用户始终可以看到具有当前值的工具提示,请提供帮助。

    $(function () {
    var slider_min_date = '{{slider_min_date}}';
    var slider_max_date = '{{slider_max_date}}';
    var slider_value_list = [];
    {% for obj in slider_list %} //slider_list is list of date obj
        slider_value_list.push(new Date('{{obj}}').getTime() / 1000);
    {% endfor %}
    var tooltips = function( event, ui ) {
        var curValue = $(this).index();
        var tooltip = $('<div class="ui-slider-tooltip" />');
        //$(event.target).find('.ui-slider-handle').append(tooltip);
        $('.ui-slider-handle').html(tooltip);
    };
    var slider = $("#slider-id").slider({
        range: false,
        min: new Date(slider_min_date).getTime() / 1000,
        max: new Date(slider_max_date).getTime() / 1000,
        step: 86400, //seconds per day
        values: slider_value_list,
        create: tooltips,
        tooltip:true,
        start: function( event, ui ) {
            $(ui.handle).find('.ui-slider-tooltip').show();
        },
        stop: function( event, ui ) {
            $(ui.handle).find('.ui-slider-tooltip').show();
        },
        slide: function(event, ui) {
          var han_val =new Date(ui.value *1000).toDateString();
          $(ui.handle).find('.ui-slider-tooltip').text(han_val);
        },
    })

});

0 个答案:

没有答案