Is possible to make a fullscreen image zoomable?

Question

I try to put a image in a full screen, and also the image can be zoomable. I use for the zoom this jquery plugin http://www.jacklmoore.com/wheelzoom/ and for the full full screen, all options described here Full-screen responsive background image

In my tests, is possible make zoom into the image, but if resize the window, the image not resize and appear spaces between the borders.

I do not know if it's better to put the image in a div, and make this div fullscreen.

Show as a fiddle with you code. There we can play with it and tell you. — Alvaro, Jul 24 '13 at 16:02

score 0 · Answer 1 · answered Jul 24 '13 at 16:06

If you provide us the fiddle we could be able to do something else but one option seems to be changing the image size on windows resize:

$(window).resize(function() {

    //in order to call the functions only when the resize is finished
    //http://stackoverflow.com/questions/4298612/jquery-how-to-call-resize-event-only-once-its-finished-resizing
    clearTimeout(resizeId);
    resizeId = setTimeout(doneResizing, 500);       
});

function doneResizing(){
    var windowsWidtdh = $(window).width();
    var windowsHeight = $(window).height();

    //setting your image dimensions 
    $('#yourImage').css('height', windowsHeight );
    $('#yourImage').css('width', windowsWidtdh );

}

Is possible to make a fullscreen image zoomable?

1 Answers1