1

Wordpress テーマを作成していますが、フッターの位置に問題があります。インデックス ページは問題ありません。style.css で「footer」の margin-top を定義しました。魔女は bckimage を 900px に、「foot_sadrzaj」の margin-top を 918px に保持します。これは、「foot_sadrzaj」にテキストと画像が保持されるためです。リンクはこちら: http://casabianca.ba/test/

さて、私がページに行くと、ページのコンテンツは or にあり、投稿を表示するときは . コンテンツを含む要素 sadrzaj または sadrzaj_single の位置と高さに応じて、フッターと foot_sadrzaj の位置を変更する JS コードをいくつか書きましたが、機能しません (ここのように: http://casabianca.ba/test/novosti/ ) 。 ....理由を理解するのを手伝ってもらえますか?

コードは次のとおりです。

var div = getElementById('sadrzaj');
var div2 = getElementById('sadrzaj_single');


if (div) {
    var z = div.style.offsetTop+div.style.offsetHeight;
    getElementById('footer').setAttribute(
            "style", "marginTop:" + z.toString() + "px");
    getElementById('foot_sadrzaj').setAttribute(
            "style", "marginTop:" + (z+18).toString() + "px");
}
else if (div2) {
    var z = div2.style.offsetTop+div2.style.offsetHeight;
    getElementById('footer').setAttribute(
            "style", "marginTop:" + z.toString() + "px");
    getElementById('foot_sadrzaj').setAttribute(
            "style", "marginTop:" + (z+18).toString() + "px");
}

どうか、私が知っているのはいくつかの JS とゼロ JQuery だけなので、「Jquery を試してみてください...」のような答えはまったく役に立ちません....

4

3 に答える 3

1

コードのいくつかの修正

window.onload = function ()
    {
        var div=document.getElementById('sadrzaj');
        var div2=document.getElementById('sadrzaj_single');

        if(div) {
            var z=div.offsetTop+div.offsetHeight;
            var footer = document.getElementById('footer');
            footer.setAttribute("style","margin-top:" + z.toString() + "px");

            var foot_sadrzaj = document.getElementById('foot_sadrzaj');
            foot_sadrzaj.setAttribute("style","margin-top:" + (z+18) + "px");
        }
        else if (div2) {
            var z=div2offsetTop+div2.offsetHeight;
            document.getElementById('footer').setAttribute("style","margin-top:" + z + "px");
            document.getElementById('foot_sadrzaj').setAttribute("style","margin-top:" + (z+18) + "px");
        }
    }
  1. を使用window.onloadして、ドキュメントの準備ができた後にのみスクリプトを実行する必要があります
  2. あなたは必要ありませstyleんdiv.style.offsetTop+div.style.offsetHeight。
  3. margin-topではなく、.setAttribute関数に書き込みますmarginTop。
  4. 追加する必要はありません.JSはtoString()これを処理する方法を知っています
  5. この行document.getElementById('footer').setAttribute("style","margin-top:" + z + "px");は、そこに書いたインライン属性を無効にしていbackground-imageます。ここから自分で処理できると思います
于 2013-02-24T12:39:45.633 に答える
0

難しいコードでも機能しましたが、1 つの角度を見落としていました。コンテンツがブラウザー ウィンドウよりも小さい場合はどうでしょうか。それともまだコンテンツがありませんか？次に、フッターが下部ではなく、中央のどこかにぶら下がっています。@MitzとJames Padolseyのおかげで、これが解決策です

最終的解決：

function getDocHeight() {
var D = document;
return Math.max(
        Math.max(D.body.scrollHeight, D.documentElement.scrollHeight),
        Math.max(D.body.offsetHeight, D.documentElement.offsetHeight),
        Math.max(D.body.clientHeight, D.documentElement.clientHeight)
    );
}

window.onload = function (){
    var div=document.getElementById('sadrzaj');
    if(div) {
        var z=div.offsetTop+div.offsetHeight;
    var z2=div.offsetTop+div.offsetHeight+18;
    var windowHeight= getDocHeight();
if(z>windowHeight) {
        var footer = document.getElementById('footer');
        footer.setAttribute("style","margin-top:" + z + "px");

        var foot_sadrzaj = document.getElementById('foot_sadrzaj');
        foot_sadrzaj.setAttribute("style","margin-top:" + z2 + "px");
}
else {
    var footer = document.getElementById('footer');
        footer.setAttribute("style","margin-top:" + windowHeight + "px");

        var foot_sadrzaj = document.getElementById('foot_sadrzaj');
        foot_sadrzaj.setAttribute("style","margin-top:" + (windowHeight+18) + "px");
    }
}
于 2013-02-25T17:07:08.377 に答える
0

コンテナ div の下部に物を揃えるためにmargin-top使用する代わりに。"bottom : 0"次に、Javascript を使用して位置を定義するのをやめ、代わりに CSS のみを使用します。

"z-index:100000"設定するのも楽しいかもしれません"position:fixed"

于 2013-02-24T12:14:00.447 に答える