2010-04-15 11 views
7

मेरे पास एक वेब पेज है जिसमें सामग्री है जो ब्राउज़र विंडो के दाएं किनारे पर फैली हुई है। मैंने नीचे स्क्रॉलबार को बंद करने के लिए <body> पर overflow-x: hidden सेट किया है, लेकिन मैं अभी भी ट्रैकपैड के साथ क्षैतिज स्क्रॉल कर सकता हूं, जो मैं नहीं चाहता हूं।ओवरफ्लो-एक्स छिपा हुआ होने पर केवल क्षैतिज स्क्रॉलिंग को रोकना संभव है?

ब्राउज़र को क्षैतिज स्क्रॉल करने से रोकने का कोई तरीका है?

एक साइड नोट के रूप में: सफारी 4.0.4 केवल क्षैतिज रूप से स्क्रॉल करता है, और स्क्रॉलिंग "चिपचिपा" और "अजीब" महसूस करती है, जबकि फ़ायरफ़ॉक्स हमेशा क्षैतिज रूप से स्क्रॉल करता है।

उत्तर

2

आप सीएसएस में स्थापित करने के लिए कोशिश कर सकते:

html{ 
    overflow-x: hidden; 
} 
के बजाय उपयोग body चयनकर्ता

। मैंने कोशिश की और फ़ायरफ़ॉक्स में काम करता है।

+0

मैंने एफएफ में भी यह कोशिश की, और ऐसा लगता है कि यह एक ही समस्या है। बेहतर समाधान होगा, जैसा कि @ कहुलकी ने नोट किया था, बस प्रदर्शन को "कोई नहीं" पर सेट करने के लिए। यदि आप इसे दिखाना चाहते हैं, तो इसे फिर से स्थानांतरित करने के लिए कुछ जेएस/jquery करें। – Automatico

1

यदि अन्य सभी विफल हो जाते हैं, तो आप जावास्क्रिप्ट का उपयोग विंडो.scrollTo (xpos, ypos) का उपयोग करके बाईं ओर स्क्रॉल करने के लिए लगातार बलपूर्वक करने के लिए कर सकते हैं। Xpos के लिए आप 0 और ypos का उपयोग करना चाहेंगे, आप उपयोगकर्ता की वर्तमान स्क्रॉल स्थिति प्राप्त करना चाहते हैं, यह मानते हुए कि आप लंबवत स्क्रॉलिंग की अनुमति देना चाहते हैं।

आप अपने फ़ंक्शन कॉल को विंडो में भी डाल सकते हैं। ऑनक्रॉल ईवेंट हैंडलर, या एक जावास्क्रिप्ट अंतराल में जो हर 100 एमएस या उससे भी अधिक चलता है। आप पर निर्भर करता है। यदि आपको कोड उदाहरणों की आवश्यकता है तो बस पूछें।

+0

स्क्रॉलिंग को रोकने के लिए, स्क्रॉलबार को छिपाने के लिए कोई 'ओवरफ़्लो: छुपा', 'window.onscroll', और 'window.scrollTo' के संयोजन का उपयोग कर सकता है, और उपयोगकर्ता को 0,0 (शीर्ष-बाईं ओर) स्क्रीन) स्क्रॉल पर, प्रभावी रूप से वेबपृष्ठ को अपनी वर्तमान स्थिति में रखते हुए (या यूजर को यूजर की वर्तमान स्क्रॉल स्थिति के रूप में लंबवत स्क्रॉलिंग को बनाए रखने के लिए @InvisibleBacon के रूप में सुझाव दिया गया है) – Seagrass

0

यह समझना बेहतर होगा कि आपके पास उदाहरण है या नहीं।

क्या यह एक लंबा यूआरएल है या कोई सफेद जगह नहीं है? क्या आपके पास white-space:nowrap; तत्व पर सेट है?

आप एक परिभाषित आकार (एक है कि व्यूपोर्ट में फिट बैठता है) के साथ एक कंटेनर है, तो पाठ सही ढंग से पालन करना चाहिए, (जब तक यह कोई रिक्त स्थान के साथ एक लंबी लाइन है)

3

मुझे लगता है कि असली सवाल है, क्यों है क्या आपकी सामग्री पृष्ठ के इच्छित आकार से बहती है? क्या यह सामग्री है कि आप नहीं चाहते हैं कि उपयोगकर्ता वास्तव में देखें? उस स्थिति में, इसे किसी div में कहीं भी रखें और इसे किसी के प्रदर्शन को सेट करें। वह ओवरफ्लो मुद्दे से पूरी तरह से बच जाएगा।

यदि कोई वैध कारण है तो आप कंटेनर को ओवरफ़्लो करना चाहते हैं, फिर कंटेनर का आकार स्पष्ट रूप से सेट करें, फिर अतिप्रवाह-x छुपाएं। मैंने इसका परीक्षण नहीं किया है, लेकिन इसे वर्तमान व्यवहार को रोकना चाहिए। यदि नहीं, तो शरीर टैग के बजाए एक div का उपयोग करने का प्रयास करें। ब्राउज़र अजीब तरीके से अभिनय कर रहे हैं क्योंकि यह शरीर टैग पर ही काम कर रहा है।

1

मैं क्रोम में जाऊंगा और डेस्कटॉप पर डेवलपर टूल खोलूंगा। ओवरफ्लो-एक्स प्रॉपर्टी निकालें। फिर अपने पृष्ठ पर प्रत्येक मूल तत्व को हटाने के लिए आगे बढ़ें। जब आप देखते हैं कि क्षैतिज स्क्रॉल बार गायब हो जाता है, तो आप जानते हैं कि आपको अपनी समस्या मिली है। फिर उस तत्व में गोता लगाएँ। मेरी शर्त है कि आपके पास 100% की चौड़ाई है और उस पर मार्जिन डाला गया है। यदि मामला है तो मार्जिन निकालें।

0

पुरानी चर्चा, लेकिन यह सही जवाब की तलाश करने वाले लोगों के लिए उपयोग की जा सकती है!

ब्राउज़र विंडो की तुलना में व्यापक तत्व के पैरेंट div पर "अतिप्रवाह: छुपा" सेट करें (HTML या शरीर जैसा कि आप सामान्य रूप से करते हैं), जो पैड या तीर पैड के साथ स्क्रॉल को रोक देगा ..

संबंधित मुद्दे