Re: Force divs/website to Horizontally scroll without fixed width

[Mottie]

Here is a demo I put together, it will always maintain the image aspect ratio (no stretching)

var adjustSize = function(){

var total = 10, // include extra width padding here

win = $(window),

winW = win.width(),

// subtract scroll bar height to prevent vertical scrollbar

winH = win.height() - 15;

$('#container img').each(function(){

var $t = $(this),

r = $t.width()/$t.height(); // image aspect ratio

// set image size, but maintain aspect ratio

worh = (r > 1) ?

{ width : winW,  height: winW/r, maxHeight: winH, maxWidth: winH*r } :

{ height : winH, width : winH*r, maxWidth: winW, maxHeight: winW/r };

$t.css(worh);

// add up total width for body size

total += $t.width();

});

$('body').width(total);

};



// run script after all the images have loaded & on window resize

$(window)

.load(function(){ adjustSize(); })

.resize(function(){ adjustSize(); });