javascript - ユーザーのブラウザの幅に応じて、easySliderスライドを動的に中央に配置するにはどうすればよいですか？

Question

これが私の質問に関連するコードです：http：//jsfiddle.net/mkerny45/V23NK/

ご覧のとおり、画像スライドの長い水平方向のチェーンがあります。ページが最初に読み込まれるときとユーザーがブラウザのサイズを変更するときの両方で、スライドの1つが常にユーザーのページの中央に表示されるようにしたいと思います。

このサイトは、私が興味を持っている機能を示しています：http: //www.freundevonfreunden.com/

Answer 1

これを行う最良の方法は、スライドのコンテナを使用するposition: absoluteかpadding-left、スライドのコンテナ上で、左の位置をピクセル単位で計算することだと思いますbrowser_width - image_width / 2。

コードの例を次に示します。

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);
});