लंबन स्क्रॉलिंग को कैसे कार्यान्वित करें?

Question

इस इस साइट केंद्र और सही धारा दोनों एक समय में स्क्रॉल कर रहे हैं अगर हम केंद्र अनुभाग स्क्रॉल में संदर्भ
http://readwrite.com/2013/02/07/robert-scoble-favorite-apps-facebook-gmail-youtube
के लिए लिंक है ...
मैं यह एक ही किया हूँ इस कोड के साथ: -

इस एचटीएमएल कोड है: -

<div id="left" class="linked"> 
<img height="600" src="http://www.visitingdc.com/images/eiffel-tower-picture.jpg"> 
</div> 
<div id="right" class="linked"> 
<img src="http://www.visitingdc.com/images/eiffel-tower-picture.jpg"> 
</div><br> 

स्क्रिप्ट: -

$(function(){ 

    $('.linked').scroll(function(){ 
     $('.linked').scrollTop($(this).scrollTop());  
    }) 

}) 

सीएसएस: -

<br>#left { width: 300px; height: 400px; overflow: scroll; float: left; } 
#right { width: 300px; height: 400px; overflow: scroll; float: left; } 

लेकिन मैं एक छोटा सा समस्या है।
उपरोक्त साइट पर दोनों एक समय में स्क्रॉल करते हैं लेकिन दाएं तरफ स्क्रॉलिंग धीमा है यह कैसे काम करता है ....?
कृपया मेरी मदद करें ...

Answer 1

http://jsfiddle.net/cuVC7/0/

कृपया इस समाधान पर एक नज़र डालें। हालांकि बहुत सार्वभौमिक नहीं है, यह आपको एक अच्छी शुरुआत दे सकता है। दाएं div की गति स्वचालित रूप से समायोजित की जाती है क्योंकि आप पहेली के सीएसएस भाग में अपनी ऊंचाई बदलते हैं।

यह ध्यान दिया जाना चाहिए कि इस तरह की 2 डी-लंबन से संबंधित समस्याओं को मूल गणित के ज्ञान की आवश्यकता होती है। उपरोक्त नमूना इस मॉडल का उपयोग करता है:

• पृष्ठ की स्क्रॉल निर्धारित करें, इसलिए हम जानते हैं कि div कितना शेष है।
• सापेक्ष स्क्रॉल की गणना करने के लिए पृष्ठ की ऊंचाई, खिड़की की ऊंचाई और बाईं ओर की ऊंचाई का उपयोग div का उपयोग करें। यही है, 0 से 1 का मान हमें दिखा रहा है कि पृष्ठ बिल्कुल स्क्रॉल नहीं किया गया है, कुछ राशि से स्क्रॉल किया गया है, या अंत तक स्क्रॉल करें।
• विंडो आकार के लिए सम्मान के साथ धीमी परत के आयामों को मानचित्र relatve स्क्रॉलधीमी परत के लिए सटीक स्क्रॉल निर्धारित करने के लिए।

Answer 2

आपको उन divs (जेएस में) के स्क्रॉलिंग व्यवहार को ओवरराइट करना होगा, और इसे उदा। दूसरे के 0.5। यहाँ एक नज़र डालें: http://net.tutsplus.com/tutorials/html-css-techniques/simple-parallax-scrolling-technique/