1

メインページがメインエリアと上部にメニューのあるセカンダリエリアで構成されているWebサイトを持っています。メインエリアはモニターの幅と高さに応じて自動的にサイズ変更されます。

W = $(window).width();
H = $(window).height();

その後

$("#toparea").css('width', W);
$("#toparea").css("height", H);

問題は、いくつかの要素を固定するためにskrollr.jsプラグインを使用していることです。既に作成した W と H を使用して、これらの要素を可変位置に固定する方法を考えていました。

たとえば、ブラウザの高さが 860 ピクセルの場合、skrollr プラグインを使用して高さが 860 ピクセルであることを検出するにはどうすればよいでしょうか。

<div id="menubar" data-1="top:100%" data-H="top:0%;" >

したがって、H ピクセルスクロールすると、メニューは画面の上部に固定されます。

skrollr プラグインが H の意味を理解するようにコーディングするにはどうすればよいですか?

おそらくAPIでそれを行う方法がいくつかありますが、これまでのところ運がありません:/

4

1 に答える 1

0

あなたが何を望んでいるのか理解できたかどうかわかりません：

相対アンカーを使用するための良い使用例のように思えます (まだ使用していない場合は、skrollr > 0.4 を使用する必要があります)。

<div id="menubar" data-1="top:100%" data-top-top="top:0%;" >

data-top-top「要素の上部がビューポートの上部にあるとき」を意味します。これらの値は事前に計算されるため、要素が実際には絶対位置にあり、動かない場合でも機能するはずです。

skrollr 0.4.2 を使用した公式の例を次に示します (必須) http://prinzhorn.github.com/skrollr/examples/fixed_nav.html

于 2012-07-26T14:27:19.253 に答える