0

ページを上下にスクロールしてもその位置に固定されるサイドバーを作成しようとしています。同時に、サイドバーがフッターと重ならないように、フッターに到達するとスクロールを停止します。

このプラグインhttp://mojotech.github.com/stickymojo/を使用 しましたが、実装に間違いがあります。誰かがこれで私を助けてくれますか?

編集

HTML

<div class="wrapper">
    <div id="sidebar"></div>
    <div id="content"></div>
</div>
<div id="footer"></div>

CSS

.wrapper { width: 1000px }
#sidebar { float: left; width: 164px }

フッターは、footer.phtml というファイルから取得されます。これを footer.phtml に追加しました。

<script type="text/javascript" src="js/stickyMojo.js"></script>
<script>
    $(document).ready(function(){
        $('#sidebar').stickyMojo({ footerID: '#footer', contentID: '#content' });
    });
</script>

リソースにスクリプト stickyMojo.js が表示されますが、サイドバーがその位置に固定されません。

4

1 に答える 1

0

あなたのコードを見ると、問題を引き起こしているのはあなたの#footer 中にあなた がいないという事実だと私は信じています。#wrapper

これが比較できる実用的なフィドルです。

編集

これは、ラッパーの外側にあるフッターのフィドルです。

ユーザーがスクロールするときに余分なコンテンツをロードすることに関しては、プラグインは#sidebar自動的にの「粘着性」を処理するようです。ロードされたコンテンツがdivのに影響することを確認してheightください#main。

これがその方法を示すフィドルです。

于 2012-11-13T15:32:00.957 に答える