Как динамически центрировать слайдер easySlider в зависимости от ширины браузера пользователя?

Question

Вот код, имеющий отношение к моему вопросу: http://jsfiddle.net/mkerny45/V23NK/

Как вы видите, есть длинная горизонтальная цепочка слайдов изображений. Мне бы хотелось, чтобы один из слайдов всегда находился в центре страницы пользователя как при загрузке страницы, так и при изменении размера браузера.

Этот сайт показывает функциональность Я заинтересован в: http://www.freundevonfreunden.com/

Answer 1

Я думаю, что лучший способ сделать это состоит в использовании position: absolute или padding-left на контейнере ваших слайдов и вычислить левую позицию в пикселях с browser_width - image_width/2.

Вот Exemple кода:

var image_width = 940; //You can also get it dynamically 

$(document).ready(function() {   
    $('#slider').css('padding-left', ($(window).width() - image_width)/2); 
}); 

$(window).resize(function() { 
    $('#slider').css('padding-left', ($(window).width() - image_width)/2); 
});