0

ページが特定のポイントを超えて下にスクロールされない限り移動しないスライディングメニューdivを作成するにはどうすればよいですか？

このリンクのコードをフローティングメニューに使用しました。ヘッダーでストップフロートを停止する方法がありますが、フッターでは停止しません。このコードを変更してフッターで停止するにはどうすればよいですか？

    //// CONFIGURATION VARIABLES:

var name    = "#sidebar";
var menu_top_limit   = 0;
var menu_top_margin  = 0;
var menu_shift_duration = 500;
var menuYloc = null;
///////////////////////////////////

$(window).scroll(function() 
{ 
 // Calculate the top offset, adding a limit
 offset = menuYloc + $(document).scrollTop() + menu_top_margin;

 // Limit the offset to 241 pixels...
 // This keeps the menu out of our header area:
 if(offset < menu_top_limit)
  offset = menu_top_limit;

 // Give it the PX for pixels:
 offset += "px";

 // Animate:
 $(name).animate({top:offset},{duration:menu_shift_duration,queue:false});
 });

フッターで停止するはずの別の同様のコードがありますが、機能していません。

var name = "#sidebar";  
var menuYloc = null;  
var footer = '#footer'; //Specify the ID for your footer.

 $(document).ready(
    function()
    {  
        menuYloc = parseInt($(name).css("top").substring(0,$(name).css("top").indexOf("px")))  
        $(window).scroll(
            function() 
            {   
                var offset = menuYloc + $(document).scrollTop();
                var anotherOffset = offset;

                var docTop = $(window).scrollTop();
                var footerTop = $(footer).offset().top;

                var maxOffset = footerTop - $(name).height() - 20;
                var minOffset = docTop;

                offset = offset > maxOffset ? maxOffset : offset;
                offset = offset < minOffset ? minOffset : offset;

                $(name).animate({top:offset + 'px'},{duration:500,queue:false});      
            }
        );  
    }
);
4

2 に答える 2

0

フッターを下部に配置し、中央をスクロールする方法をお探しの場合は、以下のブログ投稿（「Webページへ」のセクション）を参照してください。http：//wwwにアクセスしてください。 jimleo.comで実際の動作を確認してください。

http://jimleonardo.blogspot.com/2009/02/jimleocom-is-back-up-some-how-to.html

于 2009-11-14T01:01:16.303 に答える
0

常に表示されるページ フッターが必要なようです。ページの上部と下部に 1 つずつ、合計 2 つの絶対要素を作成する方がはるかに簡単ではないでしょうか。そして、すべてのコンテンツを 100% 幅/高さの div に追加します (これは JavaScript で行う必要があります)。

そうすれば、body の scroll イベントに何かを接続する必要はありません (これは決して見栄えがよくありません)。

オフセットを追加するか、コンテンツの前後にいくつかの改行を追加すると、試みたものよりもはるかにうまく機能するはずです。

私は自分のページhereでそれをやった.

于 2009-11-14T01:47:11.153 に答える