停止在手機上的javascript功能

我有這個JS功能，它將頁面中的所有內容居中。這在頁面的開始處被調用，並且在窗口被調整大小時自動居中。停止在手機上的javascript功能

我需要一種方法使網頁在移動設備上加載時不會居中任何東西。

/** 
    * This method centers a DOM element vertically and horizontally 
    * on the page. 
    * 
    * @param {object} elementHandle The object that is going to be 
    * centered. 
    */ 
    centerElementOnPage: function(elementHandle) { 
     // Center main frame vertical middle 
     $(window).resize(function() { 
      var elementLeft = ($(window).width() - elementHandle.outerWidth())/2; 
      var elementTop = ($(window).height() - elementHandle.outerHeight())/2; 
      elementTop = (elementTop > 0) ? elementTop : 20; 

      elementHandle.css({ 
       position: 'absolute', 
       left: elementLeft, 
       top: elementTop 
      }); 
     }); 
     $(window).resize(); 
    },

編輯：

謝謝你的CSS。 JS搞砸了頁面的其他方面，所以CSS有所幫助。

來源

2015-06-09 Jess

只是檢測是否在移動設備上，如果它是運行的代碼。查看http://stackoverflow.com/questions/11381673/detecting-a-mobile-browser – GillesC

你會更好[檢測屏幕分辨率]（http://stackoverflow.com/questions/2242086/how-to-detect屏幕分辨率與JavaScript）而不是移動設備 – Liam

只是在移動設備上或在移動設備和iPad上？ –

您是否考慮過使用CSS Media Queries？您可以根據屏幕大小居中/不居中。 AFAIK沒有可靠的方法來確定它是否是「移動設備」，即使使用JS，除了按屏幕尺寸進行猜測。探測用戶代理也不可靠。

一種非常原始和簡單的例子：

/* Center all the things! */ 
@media (min-width: 500px) { 
    div { 
    margin: 0 auto; 
    text-aling: left; 
    } 
} 

/* No fun allowed :(*/ 
@media (max-width: 499px) { 
    div { 
    margin: 0; 
    text-aling: left; 
    } 
}

一個重要的提示！這在舊版瀏覽器中不受支持 - 主要是IE8。 http://caniuse.com/#feat=css-mediaqueries

來源

2015-06-09 10:20:56

停止在手機上的javascript功能

回答

相關問題