【问题标题】:perform same percentage calculation with different range用不同的范围执行相同的百分比计算
【发布时间】:2014-03-27 09:40:05
【问题描述】:

我正在使用范围为 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 );
  }

【问题讨论】:

  • -75 到 75 是滑块范围,我希望功能 0-75 为 0-100
  • 这就是你想要的...jsfiddle.net/jady/qW8Db/11
  • 是的,我希望当我在 0 处移动 sloder 时,可拖动图像在左上角,当 75 图像处的滑块在右上角时
  • 尝试刷新页面并向下滚动
  • 答案已更新...看看

标签: jquery jquery-ui math css3pie


【解决方案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

【讨论】:

  • 谢谢你,如果我以后需要你的帮助,我该如何联系你
  • 给我发邮件到 jay3dec@gmail.com
猜你喜欢
  • 2021-02-16
  • 1970-01-01
  • 2016-10-12
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2017-04-06
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多