0

垂直方向の中央に配置したいアイコンのドックがあります。もちろん、これは画面の解像度などに基づいて異なります。私が現在行っていることは、ビューポートの100%のサイズの親DIVの高さです。

    var pageHeight = $('#sidebar').height();

次に、アイコンコンテナの高さを取得します。これは、CSSでは事前に決定されていないためです。

    var socialDockHeight = (document.getElementById('social_dock_container').offsetHeight * numberOfIcons);

注:これは、おそらく配列にコード化されているために、何らかの理由で1つのアイコンの高さのみを取得しますか?次に、新しい位置を計算し、jQueryを介して要素に割り当てます。

    var y = (pageHeight / 2) - (socialDockHeight / 2);
    $("#social_dock_container").css({ 
            top: y + "px"
    }).show();

これはChromeでうまく機能しますが、IE、FF、Safariでは機能しません。

4

2 に答える 2

0

アイコンを常に画面の中央に配置したいですか? アイコンがそれほど大きくない場合は、次のようにしてください。

#social_dock_container
{
    position: absolute;
    top: 50%;
}

編集

Zee Tee が述べたように、もちろん次のように margin-top を設定する必要があります。

$("#social_dock_container").css('margin-top', '-' + socialDockHeight / 2 + 'px' );
于 2012-06-15T07:55:50.383 に答える
0

を使用しない場合は$(window).height()、 を使用$('#sidebar').outerHeight();して、要素のパディングやマージンなどの他のすべての優れた機能を取得します。

また、ユーザーがいつウィンドウのサイズを変更したかを忘れないでください。そのために使用.resize();します。

于 2012-06-15T07:58:21.870 に答える