Hi,

I have created image gallery slider, the images of which scale with the window size. My problem is I can't seem to create the right formula to ensure that the slider is at the right position when the window is scaled.

If I am at the first image and the slider 'left' offset is 0 then the scaling works fine and my offset is correct, however when I am on image two and my slider is offset by say -1500 and then the window is resized, the slider is then at the wrong offset.

Taking this into account I figured I could just add / subtract the new window size difference from the slider offset and therefore have everything in the right position. I was wrong. It works for the first two images but then If I am at the end of my slider on the last image I get a nice big gap between the end of the last image and the border of the page.

Can someone please show my where I am going wrong please? I've spent days on this :(

The relevant code is as follows:

$(window).bind('resize', function(event, delta) {

    /* Resize work images - resizes all to document width */
    resizeWorkImages('div.page.work div#work ul');

    /* Position slider controls */
    positionSliderControls();

    /* Get the difference between the old window width and the new */
    var windowDiff = (gLastWindowWidth - $(window).width()) * -1;

    /* Apply difference to slider left position */
    var newSliderLeftPos = stripPx($('div.page.work div#work ul').css('left')) - windowDiff;


    /* Apply to slider */
    $('div.page.work div#work ul').css('left',newSliderLeftPos+'px')

    /* Update gSlider settings */
    gSlider.update();

    /* Record new window width */
    gLastWindowWidth = $(window).width();

});

Thanks,

eb_dev