2009-05-11 5 views
14

मैं आईफोन पर लक्षित एक वेबसाइट लिख रहा हूं। जब मैं आईफोन के अभिविन्यास में परिवर्तन करता हूं (यानी जब उपयोगकर्ता फ़ोन को लैंडस्केप और/या पोर्ट्रेट मोड में बदलता है) तो मैं <body> तत्व पर एक कक्षा सेट करना चाहता हूं।आईफोन जावास्क्रिप्ट के माध्यम से लैंडस्केप मोड में जाने पर मुझे कैसे पता चलेगा? क्या इसके लिए कोई घटना है?

क्या मैं जावास्क्रिप्ट के माध्यम से इस परिवर्तन का पता लगा सकता हूं? क्या इसके लिए कोई घटना है?

उत्तर

23

युप, onorientationchange ईवेंट और window.orientation संपत्ति के माध्यम से।

+0

यह भी एक सुरुचिपूर्ण समाधान है। – Thanks

+1

FYI ऐप्पल की सफारी संदर्भ पुस्तकालय के लिए लॉगिन आवश्यकता को हटा दिया गया है। –

+0

@ हमेशा के लिए पुलेट्स - आह, उत्कृष्ट, धन्यवाद। तदनुसार अपडेट किया गया। –

1

आप दस्तावेज़ शरीर चौड़ाई की जांच कर सकता। अगर यह अचानक छोटा या बड़ा हो जाता है, तो आप जानते हैं कि क्या हुआ। आप इसे अंतराल के साथ माप सकते हैं।

window.setInterval(function() { 
    // check body with here and compare with global variable that holds the last measurement 
    // you may set a boolean isLandscape = true if the body with became bigger. 
}, 50); 
+0

पूरी तरह से सुनिश्चित नहीं है कि काम करेगा: 'document.body.clientWidth' पोर्ट्रेट और परिदृश्य में समान मूल्य लौटाता है (कम से कम उस पृष्ठ पर जिस पर मैं काम कर रहा हूं)। यद्यपि अन्य संपत्तियां हो सकती हैं जिन्हें आप जांच सकते हैं। –

+1

आपको getComputedStyle जैसे कुछ का उपयोग करना होगा, और बॉडी टैग की गणना की चौड़ाई के लिए पूछना होगा। अगर यह सफारी में काम नहीं करता है, तो मौजूदा स्टाइल का प्रयास करें। यह भी सुनिश्चित करें कि शरीर टैग चौड़ाई = 100% प्राप्त करता है। – Thanks

+0

हाँ, यह काम कर सकता है। यह सिर्फ इतना है कि आईफोन की स्क्रीन के साथ स्केलिंग की वजह से मोबाइल सफारी की आयामों की धारणा थोड़ा सा सार लगती है। जब आप परिदृश्य में जाते हैं, तो आपको वास्तव में अधिक पिक्सेल चौड़ाई (आपके लेआउट के संदर्भ में) नहीं मिलती है, भले ही अधिक भौतिक पिक्सल उपलब्ध हों। मैंने वास्तव में जांच नहीं की है कि विभिन्न गुण क्या लौटते हैं। –

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