इस प्रोजेक्ट के बारे में

canvas-watch एक फ्रेमवर्क-अज्ञात लाइब्रेरी है जो तैरते तत्वों (जैसे स्टिकी नेविगेशन बार या ॉक किए गए प्लेयर) और पृष्ठभूमि ट्रिगर क्षेत्रों के बीच 2D ओवरलैप डिटेक्शन संभालने के लिए डिज़ाइन की गई है। IntersectionObserver के विपरीत, जो केवल तत्वों की तुलना उनके स्क्रॉल-एन्सेस्टर या व्यूपोर्ट के साथ करता है, canvas-watch बाउंडिंग आयतों की तुलना करके निर्धारित करता है कि तैरता तत्व वर्तमान में किस पृष्ठभूमि क्षेत्र के ऊपर है। मुख्य क्षमताएँ शामिल हैं: - स्वचालित क्लास टॉगलिंग: "watched" के रूप में टैग किए गए तत्वों को उस ट्रिगर क्षेत्र के आधार पर `over-*` क्लास प्राप्त होती है जिसके साथ वे सबसे अधिक ओवरलैप करते हैं (डिफ़ॉल्ट थ्रेशोल्ड 50%)। - ेस्टिंग समर्थन: नेस्टेड ट्रिगर क्षेत्र अपने कंटेनरों की तुलना में प्राथमिकता रखते हैं, जटिल लेआउट मे अधिक विशिष्ट स्टाइलिंग की अनुमति देते हैं। - व्यूपोर्ट ट्रैकिंग: एक संदर्भ तत्व के व्यूपोर्ट के ऊपर, भीतर, नीचे या अनुपस्थित होने पर प्रतिक्रियाशील रूप से ट्रैक करने की क्षमता। - प्रदर्शन अनुकूलन: एकल requestAnimationFrame लूप और IntersectionObserver का उपयोग दृश्यता गेट के रूप में करके सुनिश्चित करता है कि ओवरलैप गणना केवल स्क्रीन पर तत्वों के लिए चले। - इवेंट सिस्टम: जब भी लागू क्ास बदलती है, तो एक `canvaschange` CustomEvent डिस्पैच करता है, जो CSS से परे लॉजिक को सक्षम करता है। लाइब्रेरी एक फ्रेमवर्क-अज्ञात कोर और एक समर्पित Svelte एडेप्टर प्रदान करती है। यह SSR-सुरक्षित है और सभी धुनिक एवरग्रीन ब्राउज़र्स का समर्थन करती है।