2014-04-20 10 views
11

मैं ऐसे लेआउट पर काम कर रहा हूं जिसके लिए सटीक मीडिया क्वेरी हैंडलिंग की आवश्यकता है। मेरे मुद्दों में से एक crossbrowser स्क्रॉलबार चौड़ाई है क्योंकि यह ब्राउज़र के अनुसार अलग है और अधिकांश (उनमें से सभी?) इसे विंडो चौड़ाई में शामिल करते हैं।मीडिया प्रश्न और स्क्रॉलबार चौड़ाई

हम इन 2 उदाहरण में देख सकते हैं, मीडिया के प्रश्नों के साथ और ऊर्ध्वाधर स्क्रॉलबार के बिना एक ही विंडो आकार पर कार्रवाई नहीं करते:

  1. Test without scrollbar
  2. Test with scrollbar

में पहला उदाहरण, आप पृष्ठभूमि रंग परिवर्तन को 800/700/600px विंडो चौड़ाई पर बिल्कुल देख सकते हैं।
स्क्रॉलबार रंग में बदलने के साथ दूसरे उदाहरण में:

  • क्रोम और फ़ायरफ़ॉक्स: 779/679/579px
  • आईई: 783/783/583px

कि 21px अप करने के लिए की एक फर्क नहीं पड़ता।

मीडिया प्रश्नों में स्क्रॉलबार को अनदेखा करके और उपलब्ध चौड़ाई पर ध्यान केंद्रित करके आसपास एक काम है।
यदि आप इस समस्या को कैसे संभालते हैं, तो क्या आप स्कॉलबार के लिए अधिकतम चौड़ाई तय करते हैं और इसे मीडिया प्रश्नों में शामिल करते हैं?

- अद्यतन -

मैं सीएसएस के साथ सर्वोत्तम प्रथाओं/समाधान तलाश कर रहा हूँ के रूप में मैं इस परियोजना के लिए जे एस से बचने के लिए चाहते हैं।

+0

यह अन्य कार्य के समान दिखता है। इसे आजमाएं: [http://stackoverflow.com/questions/15976531/dealing-with-scroll-bars-and-jquery-width-method] [1]: http://stackoverflow.com/questions/15 976531/डीलर-साथ-स्क्रॉल-बार-एंड-jquery-width-method – Petroff

+0

@Nividim मैंने यह प्रश्न देखा था लेकिन उत्तर मेरी आवश्यकताओं के अनुरूप नहीं है, मैं एक सीएसएस समाधान की तलाश में हूं। –

+0

@ वेब-टिकी, मेरे उत्तर ने आपकी मदद की? कोई टिप्पणी? यह स्वीकार नहीं किया गया है, मुझे कुछ गलत होने पर बताएं, कृपया, मैं अतिरिक्त जानकारी जोड़ने या समझाऊंगा। –

उत्तर

5

देखो इस उदाहरण: http://stowball.github.io/mqGenie/

यह ठीक फ़ायरफ़ॉक्स में और क्रोम में दोनों मेरे लिए (स्क्रॉलबार के साथ) काम कर रहा है।

आप डाउनलोड करने और इस प्लगइन के बारे में अधिक पढ़ सकते हैं: https://github.com/stowball/mqGenie (~ 2.2 केबी)

स्रोतों में से एक: https://stackoverflow.com/a/21414947/2898694

का आनंद लें।

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