Zoom function almost complete

Question

My co-worker almost finished this zoom function, but I can't figure out how to complete it. Here is a jsFiddle. The red dots are supposed to stay in the same location relative to the image as you move the slider on the right. Everything is great except the code in the $('.marker').each(function(){...}); I have tried many combinations, but can't seem to get the right logic for the zoom. Thanks!

Here is the JS:

$( "#sliderVertical" ).slider({
    orientation: "vertical",
    range: "min",
    min: 0,
    max: 100,
    value: 50,
    slide: function( event, ui ) {
        $( "#sliderValue" ).text( ui.value );
        var backImg = $('img');
        if (ui.value == 0) {
            ui.value = 0.1;
        }        
        var width = ui.value * 12;
        var height = width * .75;

        $('.marker').each(function(){
            var marginLeft = parseFloat($(this).css('margin-left')),
            totalWidth = parseFloat(backImg.css('width'));
            var newMarginLeft = null;

            var marginTop = parseFloat($(this).css('margin-top')),
            totalHeight = parseFloat(backImg.css('height'));
            var newMrginTop = null;

            console.log(totalHeight);

            //$(this).css({'margin-left': newMarginLeft + 'px', 'margin-top': newMrginTop + 'px'});
        });

        var marLeft =  0 - (width / 2);
        var marTop = 0 - (height / 2);

        backImg.css({'width': width + 'px', 'height': height + 'px', 'margin-left': marLeft + 'px', 'margin-top': marTop + 'px'});

    }
});

Answer 1

$('.marker').each(function(){
            var marginLeft = parseFloat($(this).css('margin-left')),
            totalWidth = parseFloat(backImg.css('width'));
            var newMarginLeft = marginLeft*width/totalWidth;

            var marginTop = parseFloat($(this).css('margin-top')),
            totalHeight = parseFloat(backImg.css('height'));
            var newMrginTop = marginTop*height/totalHeight;

            console.log(totalHeight);

            $(this).css({'margin-left': newMarginLeft + 'px', 'margin-top': newMrginTop + 'px'});
        });

DEMO