perform same percentage calculation with different range

Question

i am moving a image using a slider whose range is 0 to 100 percent it work perfect by getting the background image left according to slider value now i want to perform same function but slider have range -75 to 75 who can i calculate same left so that at slider value 75 it become equal to above slider value 100 i am week in Math please point me in right direction

hare is the code 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 );
  }

Answer 1

Here is the code

$(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);
        }
    });

});

Here is the demo