फोन अंतराल में jquery मोबाइल द्वारा ओरिएंटेशन चेंज इवेंट कार्यान्वयन

Question

क्या कोई मुझे फोन अंतर में jquery मोबाइल द्वारा अभिविन्यास परिवर्तन ईवेंट के लिए सही कोड बता सकता है? मैं इस अभिविन्यास को कहां और कैसे कार्यान्वित कर सकता हूं चेंज फ़ंक्शन? आप आईओएस और orientationchange लक्षित कर रहे हैं, आप बाँध समारोह की घटना पैरामीटर में आकार घटना में जोड़ सकते हैं

if(event.orientation){ 
     if(event.orientation == 'portrait'){ 
        //do something 
     } 
     else if(event.orientation == 'landscape') { 
        //do something 
     } 
} 

Answer 1

$(window).bind('orientationchange', _orientationHandler); 

तो _orientationHandler समारोह में

, की तरह कुछ है काम नहीं करता चूंकि बदलते अभिविन्यास का आकार बदलना भी होता है।

Answer 2

$(window).bind('orientationchange', function(e){ 
    if ($.event.special.orientationchange.orientation() == "portrait") { 
     //Do whatever in portrait mode 
    } else { 
     //Do Whatever in landscape mode 
    } 
}); 

:

Answer 3

अभिविन्यास परिवर्तन का पता लगाने के लिए निम्नलिखित कोड सभी ब्राउज़रों में काम करना चाहिए। यह jquery मोबाइल ईवेंट का उपयोग नहीं करता है लेकिन अधिकांश उपकरणों के लिए काम करता है।

1. var isIOS = /safari/g.test(navigator.userAgent.toLowerCase()); 
2. var ev = isIOS ? 'orientationchange' : 'resize'; 
3. var diff = (window.innerWidth-window.innerHeight); 
4. $(window).bind(ev,function(){ 
5.  setTimeout(function(){ 
6.   if(diff*((window.innerWidth-window.innerHeight)) < 0) 
7.    orientationChanged(); 
8.  },500); 
9. }); 

पंक्ति 2 किसी भी गैर- Safari ब्राउज़र के बाद से अन्य उपकरणों में अन्य ब्राउज़रों उन्मुखीकरण परिवर्तन घटना की तुलना में अधिक लगातार आकार घटना को ले के लिए आकार बदलने घटना लेता है। http://www.quirksmode.org/m/table.html

लाइन 5 एक टाइमआउट में चेक करता है क्योंकि कुछ एंड्रॉइड देशी ब्राउज़र तुरंत नई चौड़ाई नहीं लेते हैं।

रेखा 6 अभिविन्यास परिवर्तन के लिए पुरानी और नई ऊंचाई और चौड़ाई के अंतर का उत्पाद नकारात्मक होना चाहिए।

Answer 4

मैं अपने मोबाइल टेम्पलेट्स में यह उपयोग कर रहा हूँ, के रूप में orientationchange घटना iOS 7 सफारी पर ट्रिगर नहीं किया गया था:

// ORIENTATION CHANGE TRICK 
    var _orientation = window.matchMedia("(orientation: portrait)"); 
    _orientation.addListener(function(m) { 
     if (m.matches) { 
      // Changed to portrait 
      $('html').removeClass('orientation-landscape').addClass('orientation-portrait'); 
     } else { 
      // Changed to landscape 
      $('html').removeClass('orientation-portrait').addClass('orientation-landscape'); 
     } 
    }); 
    // (event is not triggered in some browsers) 
    $(window).on('orientationchange', function(e) { 
     if (e.orientation) { 
      if (e.orientation == 'portrait') { 
       $('html').removeClass('orientation-landscape').addClass('orientation-portrait'); 
      } else if (e.orientation == 'landscape') { 
       $('html').removeClass('orientation-portrait').addClass('orientation-landscape'); 
      } 
     } 
    }).trigger('orientationchange'); 
    // END TRICK