1. 程式人生 > >jquery動態載入css樣式檔案

jquery動態載入css樣式檔案

需求:頁面展示時,需要js判斷手機寬度(解析度),當寬度大於某個值時,引用big.css,當寬度小於某個值時,引用small.css,本來css中可以判斷,但是由於終端不識別,素以只能手動程式碼判斷了。

實現:在js加入程式碼(最好在開頭位置)

     // 獲取手機螢幕寬度
     var screenWidth = window.screen.width * window.devicePixelRatio;
      // 根據螢幕大小判斷要載入的css
       if(screenWidth > 640){
                document.write("<link href='<%=contextpath%>/common/css/paymentayxwap/big.css' rel='stylesheet' type='text/css' />");
       }else {
                document.write("<link href='<%=contextpath%>/common/css/paymentayxwap/small.css' rel='stylesheet' type='text/css' />");
      }