执行不同范围的相同百分比计算

时间:2014-03-27 09:40:05

标签: jquery jquery-ui math css3pie

我正在使用范围为0到100%的滑块移动图像,它通过根据滑块值保留背景图像来完美地工作现在我想要执行相同的功能但滑块的范围是-75到75我可以计算相同的左边,以便在滑块值75它变得等于上面的滑块值100我在数学周,请指向正确的方向

野兔是代码 jsfiddle

     // when range from 0 to 100
 $( "#sliderAbove" ).slider({
   min: 0,
   max: 100,
   slide: function( event, ui ) {
       var backImgwidth = $("#backgroundImg").width();
       var left = (( backImgwidth / 100 ) * (ui.value)) ;
       $("#dragable").css("left",left);
   $( "#above" ).val(ui.value );
  }

1 个答案:

答案 0 :(得分:1)

这是代码

$(document).ready(function () {
    $("#dragable").draggable();

    $("#sliderbelow").slider({
        min: 0,
        max: 75,
        slide: function (event, ui) {
            var backImgwidth = $("#backgroundImg").width();
            var draggableWidth = $('#dragable').width();

            var diff = Number(backImgwidth) - Number(draggableWidth);
            var factor = diff / 75;

            var left = (factor * (ui.value));

            $("#dragable").css("left", left);
            $("#below").val(ui.value);
        }
    });

});

以下是demo