2013-01-10 14 views
17

मैंने हाल ही में कुछ डरावना देखा है, मुझे यकीन नहीं है कि शायद मुझे कुछ याद आ रहा है लेकिन मुझे समझ में नहीं आ रहा है कि यह क्यों हो रहा है।

मैं एक साइट है कि निम्नलिखित jQuery उस पर चल रहा स्निपेट है:

$(window).resize(function(){ 
    alert("Resize fired!"); 
}); 

जब मैं एक Android फ़ोन ब्राउज़र में साइट पर जाते हैं और केवल ऊपर स्क्रॉल और साइट नीचे, मैं देख सकता चेतावनी।

एंड्रॉइड ब्राउजर स्क्रॉल बार (जो फीका इन और आउट) पूरी साइट पर चल रहा है और खिड़की के किसी भी आकार का कारण नहीं लग रहा है, इसलिए मुझे लगता है कि इस घटना को उनके द्वारा निकाल दिया नहीं जा रहा है ।

क्या किसी को पता है कि एंड्रॉइड ब्राउज़र स्क्रॉलिंग पर इस घटना को क्यों फायर कर रहा है?

किसी भी जानकारी की सराहना की जाएगी।

संपादित करें:

मैं शरीर के लिए सीएसएस की स्थापना, अतिप्रवाह-y स्थापित करने को देखने के लिए कि अगर एक व्यवहार्य समाधान था, लेकिन घटना अभी भी एंड्रॉयड पर स्क्रॉल पर गोलियां चलाई जा रही है स्क्रॉल करने के लिए कोशिश की है।

संपादित करें # 2:

मैं अपने HTML में निम्न मेटाटैग उपयोग कर रहा हूँ:

<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1"> 
+0

मुझे आईओएस पर एक समान अजीब समस्या है (http://stackoverflow.com/questions/14157942/orientationchange-event-fires-scroll-resize-event देखें)। क्या आपने एक खाली एचटीएमएल (इसमें व्यूपोर्ट मेटा के साथ) और केवल आकार बदलने की चेतावनी की कोशिश की है? क्या यह अभी भी आग लग रहा है? –

+0

@c_kick मैं पुष्टि कर सकता हूं कि यह एक खाली HTML परीक्षण पृष्ठ पर होता है। मैंने अपनी साइट के व्यवहार को बदलकर इसे पाने में कामयाब रहा है, लेकिन मुझे यह जानकारी ऑनलाइन नहीं मिल रही है कि यह – Dan

+3

क्यों करता है जो मैं कोशिश करता हूं वह '$ (विंडो) .scroll' ईवेंट से जुड़ा हुआ है, और स्क्रॉलिंग होने पर '$ (विंडो) .resize (function (e) {e.stopPropagation();} 'सेट करें। लेकिन मैं आपके साथ गर्मजोशी से सहमत हूं कि यह कष्टप्रद है और उसे एक समाधान की आवश्यकता नहीं है। –

उत्तर

5

मैं एक ही समस्या हो रही थी, मेरे समाधान की जाँच करने के लिए था, तो विंडो का आकार वास्तव में करने के लिए, बदला मुझे अपने ऐप में पिछली खिड़की की चौड़ाई को स्टोर करने की ज़रूरत थी।

$(window).resize(function() { 
    clearTimeout(app.resize.timer) 
    app.resize.timer = setTimeout(function(){ 
    var window_changed = $(window).width() != app.size.window_width 
    if(window_changed) console.log('Window size changed! resize site') 
    }, 500)    
}) 

मैं खिड़की ऊंचाई पर भरोसा नहीं किया क्योंकि मेरे Android ब्राउज़र को छुपाता है और जब मैं लंबवत स्क्रॉल

1
पर खिड़की ऊंचाई परिवर्तन करने साइट नीचे स्क्रॉल पते के पाठ बॉक्स दिखाता है: कोड कुछ इस तरह हो सकता है

मुझे भी वही समस्या है!
समस्या सच है क्योंकि यूआरएल बार छुपाएं और दिखाए जाने पर एंड्रॉइड में ब्राउज़र की ऊंचाई बदल जाएगी। इसलिए, हमें ब्राउज़र रीलोड करना होता है जब चौड़ाई आकार बदलता है।

मैंने देखा कि यह question in Stackoverflow मुझे दिखाएं कि यह कैसे करें। और यह jsfiddle है।

 var doit; 
     function resizedw(appwidth){ 
      var window_changed = $(window).width() != appwidth; 
      if ($(window).width() != appwidth){ 
      ("body").append("did it"+appwidth+" "); 
      } 
      past_width = $(window).width(); 
     } 

     var past_width = $(window).width(); 
     window.onresize = function() { 
     clearTimeout(doit); 
     doit = setTimeout(function() { 
      resizedw(past_width); 
     }, 100); 
     }; 
1

@ जॉन-McCollum टिप्पणी में सही है। यह गायब ब्राउज़र इंटरफ़ेस प्रतीत होता है जिससे आकार में परिवर्तन होता है जो आकार बदलने की घटना को ट्रिगर करता है। इसलिए यदि आप उत्तरदायी डिज़ाइन सामग्री कर रहे हैं तो आप चौड़ाई में बदलाव की जांच करें, जहां आप यह जांचना चाहते हैं कि चौड़ाई का आकार बदल गया है या नहीं।

$(window).resize(function(){ 
    var w = $(window).width(); 
    if (typeof checkw == 'undefined') checkw = w; 
    if (w!=checkw) { 
     console.log("The width changed from "+checkw+" to "+w); 

     // do your responsive magic! 

     checkw = w; 
    } 
}); 

इस काम को करने की आवश्यकता नहीं है, लेकिन यह जोड़े Paul Irish/John Hann "smartresize" method के साथ अच्छी तरह से हैं।

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