जब कोई उपयोगकर्ता किसी वेब पेज पर जाता है (जब पृष्ठ में स्क्रॉलबार की सक्रियण को ट्रिगर करने के लिए पर्याप्त सामग्री नहीं है) ब्राउज़र का वर्टिकल स्क्रॉलबार दिखाई देने के लिए सीएसएस की आवश्यकता होती है?मुख्य स्क्रॉलबार हमेशा दिखाना
html {
overflow: -moz-scrollbars-vertical;
overflow-y: scroll;
}
इससे स्क्रॉलबार हमेशा दिखाई देता है और आवश्यकता होने पर ही सक्रिय होता है।
अपडेट: यदि उपर्युक्त इसका उपयोग कर काम नहीं कर सकता है।
html {
overflow-y:scroll;
}
html {
overflow-y: scroll;
}
क्या आप चाहते हैं कि?
दुर्भाग्य से, ओपेरा 9.64 जब HTML या BODY के लिए आवेदन किया है कि सीएसएस घोषणा की अनदेखी करने, हालांकि यह DIV जैसे अन्य ब्लॉक स्तर तत्वों के लिए काम करता है लगता है।
html {height: 101%;}
मैं उपयोग इस पार ब्राउज़र समाधान(ध्यान दें: यह मैं हमेशा 1 लाइन में doctype घोषणा उपयोग करते हैं, मैं अगर यह quirksmode में काम करता है पता नहीं है, कभी नहीं परीक्षण किया)।
यह हमेशा प्रत्येक पृष्ठ में एक सक्रिय लंबवत स्क्रॉल बार दिखाएगा, लंबवत स्क्रॉलबार केवल कुछ पिक्सेल के स्क्रॉल करने योग्य होगा।
जब पृष्ठ सामग्री ब्राउज़र के दृश्य क्षेत्र (पोर्ट देखें) की तुलना में कम है, तो भी आप लंबवत स्क्रॉलबार सक्रिय देखेंगे, और यह केवल कुछ पिक्सल स्क्रॉल करने योग्य होगा।
मामले में आप क्योंकि आप गैर मानक सीएसएस उपयोग नहीं कर रहे इस समाधान अपने सीएसएस कोड का उपयोग भी W3C के लिए मान्य होगा द्वारा सीएसएस सत्यापन (मैं केवल HTML सत्यापन के साथ obesessed कर रहा हूँ) के साथ रहते हैं की तरह -moz-scrollbars-vertical
सुरुचिपूर्ण समाधान –
गुण स्थापित 101% की ऊंचाई समस्या का मेरा समाधान है। व्यूपोर्ट ऊंचाई और जो नहीं करते हैं, उनके बीच स्विच करते समय आपके पृष्ठ अब 'झटका' नहीं होंगे।
मैं इसे शरीर टैग में जोड़कर काम करने में सक्षम था। मेरे लिए अच्छा था क्योंकि मेरे पास HTML तत्व पर कुछ भी नहीं है।
body {
overflow-y: scroll;
}
पिछले वर्षों में चीजें बदल गई हैं। उपर्युक्त उत्तर सभी मामलों में अब मान्य नहीं हैं। ऐप्पल disappearing scrollbars हर जगह धक्का दे रहा है। मैकओ (और आईओएस) पर सफारी, क्रोम और यहां तक कि फ़ायरफ़ॉक्स केवल स्क्रॉल करने पर स्क्रॉलबार दिखाते हैं - मुझे वर्तमान विंडोज/आईई के बारे में पता नहीं है। हालांकि वेबकिट पर आईई scroll bars शैली के गैर-मानक तरीके हैं (आईई ने बहुत समय पहले गिरा दिया था)।
लेकिन यह उन नए लोगों पर शानदार ढंग से खराब हो जाता है? – Ben
गायब स्क्रॉलबार पर इस उत्कृष्ट बिंदु के लिए धन्यवाद। मेरे लिए स्क्रॉलबार को दृश्यमान रखने का कारण उस मामूली लेकिन बहुत ही ध्यान देने योग्य और बहुत परेशान झटका से बचने के लिए था क्योंकि स्क्रॉल करने से सामग्री में बदलाव आया था। गायब होने वाले स्क्रॉलबार के साथ, जब वे दिखाते हैं और छुपाते हैं तो वे शरीर को झटका नहीं देते हैं, इसलिए यह मेरे लिए ठीक है। लेकिन इस उत्कृष्ट बिंदु के लिए धन्यवाद। – Noitidart
एक यूएक्स दृष्टिकोण से, ज्यादातर बार हम स्क्रॉलबार दृश्यमान चाहते हैं। वर्तमान प्रवृत्ति के अनुसार, यदि कोई स्क्रॉलबार दिखाई नहीं दे रहा है, तो सूची में अधिक के लिए दृश्य सूची को "आज़माएं" के लिए अतिरिक्त चरण है। एक अतिरिक्त दृश्य सुराग जो ड्रॉप डाउन या सूची में अधिक आइटम हैं, यदि लोग स्क्रॉलबार देखते हैं तो इसकी आवश्यकता नहीं होती है। – windsurf88
एचटीएमएल तत्व की चौड़ाई 100vw पर सेट करने का एक वैकल्पिक तरीका है। यदि अधिकांश ब्राउज़रों में नहीं हैं, तो यह चौड़ाई पर स्क्रॉलबार के प्रभाव को अस्वीकार करता है।
html { width: 100vw; }
अपने CSS स्टाइलशीट के लिए इस कोड जोड़ें:
html {overflow-y: scroll;}
इसके लिए बस इतना है कि!
बिल्कुल वही उत्तर पहले से मौजूद है [यहां] (http://stackoverflow.com/a/1202450/3679857)। –
और यह उत्तर पोस्ट करने से पहले 6 साल बाद जोड़ा गया था। –
सुनिश्चित करें कि अतिप्रवाह "स्क्रॉल" पर सेट नहीं है "ऑटो"। ओएस एक्स शेर में, के साथ, "स्क्रॉल" पर सेट ओवरफ्लो उस स्क्रॉलबार में ऑटो की तरह व्यवहार करता है, तब भी उपयोग किए जाने पर ही दिखाया जाएगा। तो यदि ऊपर दिए गए कोई भी समाधान काम नहीं कर रहे हैं तो ऐसा क्यों हो सकता है। यदि आप डिफ़ॉल्ट पसंद नहीं है
::-webkit-scrollbar {
-webkit-appearance: none;
width: 7px;
}
::-webkit-scrollbar-thumb {
border-radius: 4px;
background-color: rgba(0, 0, 0, .5);
-webkit-box-shadow: 0 0 1px rgba(255, 255, 255, .5);
}
आप इसे तदनुसार शैली कर सकते हैं:
यह वही है आप इसे ठीक करना होगा है।
क्या आप फ़ायरफ़ॉक्स के लिए कामकाज जानते हैं? – coderVishal
body { height:101%; } बड़े पृष्ठों को "फसल" करेगा।
इसके बजाय, मैं का उपयोग करें:
body { min-height:101%; }
इस प्रश्न को 5 साल पहले पूछा गया था और इसका पहले से ही एक स्वीकार्य उत्तर है। आपका उत्तर पहले से स्वीकृत उत्तर से बेहतर उत्तर प्रदान नहीं करता है। –
यह उत्तर वास्तव में अन्य उत्तरों में प्रदान की गई अतिरिक्त जानकारी प्रदान नहीं करता है। – GaTechThomas
आप किसी भी विचार एफएफ का कौन सा संस्करण 'ओवरफ़्लो- y' के लिए समर्थन लाया है? ऐसा लगता है कि '-मोज़-स्क्रोलबार-वर्टिकल 'को' अतिप्रवाह-वाई' संपत्ति के पक्ष में बहिष्कृत किया गया है। –
मुझे लगता है कि इंटरनेट एक्सप्लोरर 6.x +, फ़ायरफ़ॉक्स 1.5+ अगर मुझे सही याद है। मैं उपरोक्त कोड का उपयोग कर रहा हूं और यह मेरे लिए एफएफ 1.5-3.5.1 और आईई 6-8 में काम करता है। – Corv1nus
धन्यवाद, +1। मैं उस '-मोज़' संपत्ति के बारे में भूल गया। –