スクロールの要素を移動する

私はちょうどJavascriptとJQueryを使いこなしています。私は最近、Web上で見たような効果を達成しようとしています。albietははるかに単純な形式です。スクロールの要素を移動する

私がしようとしているのは、ユーザーがスクロールするときにdivを水平に移動させることです。私の思考は、単純なプロトタイプでは、スクロールバーの位置を見て、ページの1％を移動するたびにdivを一定の増分だけ動かします。私はとの問題を抱えてきた

//Script 
var percent = Math.round((1/100)*document.height); 
$(document).ready(function(){ 
    var boxpos = 10; 

    $(window).scroll(function(){ 
     var pos = $(window).scrollTop(); 
     if(pos%percent==0){ 
      boxpos+=10; 
      $("#box").css("{left:"+boxpos+";}"); 
     } 
    }); 
}); 


//css 
#content{width:100%; height:4000px;} 
#res{position:fixed; left:20px;} 
#box{position:fixed; width:20px; height:20px; left:10px; background-color:#F66;} 

//html 
<body> 
<div id="content"> 
    <div id="box"><p>&nbsp;</p></div> 
    <p id="res"></p> 
</div> 

</body>

ことの一つは、percentの値は、それが必要のように思わないことですし、ほとんどの時間が0であることがあるべき理由を私は理解できません。

私は初心者ですので、すべてのコメントは大歓迎です。私はこれに貧弱な方法で接近していますか？

ありがとうございます！

編集：あなたは私が何を言っているかのすべてのより良いアイデアを与えること：http://nizoapp.com/

出典

2011-07-26 danem

を試してみてください？ pは百分率ですか？ –

おっと、私は元々「パーセント」「p」と呼んでいましたが、読みやすさのためにすべてをパーセントに変更しました。申し訳ありません。 – danem

pos％percentは「正のパーセント」です。モジューロは、2つの数の剰余である。例えば10％3は1になります（10/3 = 9.残りは1）。これは正しい論理ですか？ –

（POS用の％p == 0）場合、pはから定義されているこの

var percent = Math.round((1/100)*$(document).height()); 
$(document).ready(function(){ 
    var boxpos = 10; 

    $(window).scroll(function(){ 
     var pos = $(document).scrollTop(); 
     if(pos%percent==0){ 
      boxpos+=10; 
      $("#box").css("left", boxpos); 
     } 
    }); 
});

出典

2011-07-26 18:12:35 ShankarSangoli

私は働いていないようです。なんらかの理由で、Chromeの開発者コンソールがUncaught TypeErrorについて不平を言っています.18行目のnullのプロパティ 'scrollHeight'（パーセントを定義する行です）を読み取ることができません。しかし、私がコンソールに同じものを入力すると、エラーはありません... – danem

スクロールの要素を移動する

答えて

関連する問題