2012-01-25 15 views
0

私は、コンテナ(親)よりもサイズが大きいdivの配列を持っています。オーバーフローがコンテナに隠されていて、地図上のJQueryオーバースクロールを呼び出して、iPhoneの感じを与えるhttp://www.azoffdesign.com/overscroll多方向スクロールフォロー効果を実装する方法は?

ユーザーが配列をスクロールして中央のdiv(home)がオーバーフローして視線を外したときに、トラッキング矢印を実装する方法に問題があります。ユーザーがオーバーフロー領域に「ホーム」をスクロールすると、コンテナの内側の端に矢印が表示され、外側に出るときは矢印の周りに矢印が表示されます。矢印の画像を使用して、それを回転させて、「家」が移動したときに正しい方向を指すようにすることは理にかなっています。ここで

は、ベースの仕事と私のバイオリン>です http://jsfiddle.net/virtuapete/QVQ5r/1/

だから、オーバーフローに動き回るよう、それは「ホーム」次...画像を適切に動作させるために、この3つの要素、画像の回転があります

私はこの効果を以前に見たことがあり、問題に取り組んでいると確信しています。私はこのコンセプトの一次元の例になるので、スクロールフォローのテクニックを探し始めました。多方向のスクロールのようなものがほとんど続いています。今私は自分自身を完全に混乱させてしまいました。私は、私が望んだ結果に見つかったdiffコードスニペットを融合させる能力がまだまだ強くないのです!

コンテナの境界を離れてしまったオブジェクト(その例ではカーソル)に続くdivなしで、私が望む行に沿っている可能性のあるjsfiddle(http://jsfiddle.net/hj57k)が見つかりました。私はちょうど行く方法をつかまえているので、どんな助けが素晴らしいだろう...側面の周りのオブジェクトに従うようにdivを得ることは素晴らしいスタートになり、おそらくそこからそれを取ることができるだろう...

+0

問題を解決するためのより良い方法のようにdiv要素を考えているjavascriptの4行を追加します(#2)別のdivの上に配置され(#1)コンテナ内のどこのdiv# 2の動きは、コンテナのエッジ内に制限されていますか? – lukas56z

答えて

1
+1

あなたのレイアウトはおなじみです;) –

+0

これは非常に良い仕事です!どのように静止しているのではなく、コンテナの端の周りを動かすためにその矢印を得ることが目標です...そして私はぼんやりとしています!はい、あなたのおかげで、レイアウトは素晴らしいです! – lukas56z

+1

これはいいですか? http://jsfiddle.net/green/GpG3U/ –

1

ここでは、多方向スクロールのためのフィドルが更新されています。 もしかしたらこの

$(".container").overscroll({ 
    direction: 'auto' 
}); 

Jsfiddle Demo

関連する問題