मेरे पास कोड है कि यह सामान्य रूप से व्यवहार करता है लेकिन मैं गति स्क्रॉल को कार्यान्वित करना चाहता हूं। काम करने के लिए गति स्क्रॉल के लिए, मुझे बॉडी टैग पर स्थिति तय करने की आवश्यकता है। वह एक समस्या नही है। समस्या विभिन्न तत्वों में पूर्ण स्थिति और फ्लेक्स ग्रिड के साथ होती है।

क्या आप एक तरीका जानते हैं जिससे मैं निश्चित स्थिति को बायपास कर सकता हूं?

मैं गति स्क्रॉल को लागू करने के लिए बटर.जेएस लाइब्रेरी का उपयोग कर रहा हूं लेकिन मैंने इस कोडपेन के साथ परीक्षण किया और यह वही परिणाम देता है

const body = document.body;
const main = document.getElementById('main');

let sx = 0, // For scroll positions
    sy = 0;
let dx = sx, // For container positions
    dy = sy;


body.style.height = main.clientHeight + 'px';


main.style.position = 'fixed';
main.style.top = 0;
main.style.left = 0;

// Bind a scroll function
window.addEventListener('scroll', easeScroll);


function easeScroll() {
  
  sx = window.pageXOffset;
  sy = window.pageYOffset;
}


window.requestAnimationFrame(render);

function render(){
  //We calculate our container position by linear interpolation method
  dx = li(dx,sx,0.07);
  dy = li(dy,sy,0.07);
  
  dx = Math.floor(dx * 100) / 100;
  dy = Math.floor(dy * 100) / 100;
  
  
  main.style.transform = `translate3d(-${dx}px, -${dy}px, 0px)`;
 
  
  
  window.requestAnimationFrame(render);
}

function li(a, b, n) {
  return (1 - n) * a + n * b;
}

जैसा कि मैंने कहा कि यह किसी कोड या इसे टाइप करने के तरीके से कोई समस्या नहीं है। मुझे इसे संभालने में त्रुटि नहीं मिलती है। लेकिन यह

main.style.position = 'fixed';

समस्या यह है। मैं बॉडी टैग से कनेक्ट करने का प्रयास कर रहा हूं लेकिन यह अभी भी वही समस्या है

कोडपेन से लिंक करें मोमेंटम स्क्रॉल

यह एक छवि है जो दिखाती है कि यह कैसे गड़बड़ करता है

2
Matija 20 अक्टूबर 2021, 19:20

1 उत्तर

सबसे बढ़िया उत्तर

'मुख्य' तत्व की चौड़ाई बदलने का प्रयास करें। वे आम तौर पर केवल तत्वों को फिट करने के लिए कोडित होते हैं, स्क्रीन पर नहीं

1
Matija 22 अक्टूबर 2021, 12:34