CSS scroll-snap-stop विशेषता

परिभाषा और उपयोग

कंप्यूटर प्लेट या टचस्क्रीन पर तेजी से स्क्रॉल करते समयscroll-snap-stop गुण का उपयोग, स्क्रॉल को सीधे एलीमेंटों को चूकने के बजाय, रुकने और अगले एलीमेंट पर लटकने के लिए किया जाता है。

स्क्रॉल लटकने के रुख को नियंत्रित करने के लिए, उप-एलीमेंट पर गुण को सेट करना आवश्यक है scroll-snap-stop और scroll-snap-align गुण, साथ ही अपने पितृ तत्व पर scroll-snap-type गुण

ध्यान दें: आपको तक्ता या टचस्क्रीन वाले उपकरण पर हाथ की गति का उपयोग करके इस गुण को अनुभव करने के लिए होना चाहिए scroll-snap-stop गुण के प्रभाव

उदाहरण

कंप्यूटर प्लेट या टचस्क्रीन पर तेजी से स्क्रॉल करते समय, स्क्रॉल को मजबूरी से रुका दिया जाएगा और अगला एलीमेंट पर लटका दिया जाएगा न कि सीधे एलीमेंटों को चूक जाएगा:

div {
  scroll-snap-stop: always;
}

अपने आप से प्रयोग करें

CSS व्याकरण

scroll-snap-stop: normal|always|initial|inherit;

गुण मूल्य

मूल्य वर्णन
normal मूलभूत मूल्य।कंप्यूटर प्लेट या टचस्क्रीन पर तेजी से स्क्रॉल करने के बाद, स्क्रॉल को धीरे-धीरे बढ़ाया जाएगा और कई एलीमेंटों को चूक जाएगा。
always कंप्यूटर प्लेट या टचस्क्रीन पर तेजी से स्क्रॉल करने के बाद, स्क्रॉल को रुका दिया जाएगा और अगला एलीमेंट फोकस के स्थान पर लटका दिया जाएगा。
initial इस गुण को उसके मूलभूत मूल्य पर सेट करें। देखें initial
inherit अपने पितृ तत्व से इस गुण को विरासत करें। देखें inherit

तकनीकी विवरण

मूलभूत मूल्य: normal
विरासतशीलता: नहीं
एनीमेशन निर्माण: समर्थन नहीं किया जाता। देखें:एनीमेशन संबंधी गुण
संस्करण: CSS3
जेसक्रिप्ट व्याकरण: object.style.scrollSnapStop="always"

ब्राउज़र समर्थन

तालिका में दिए गए नंबर इस गुण को पूरी तरह से समर्थन देने वाले पहले ब्राउज़र का संस्करण के रूप में प्रदर्शित करते हैं。

च्रोम एज फायरफॉक्स सैफारी ओपेरा
75.0 79.0 103.0 15.0 62.0

संबंधित पृष्ठ

संदर्भ:CSS scroll-snap-align विशेषता

संदर्भ:CSS scroll-snap-type विशेषता