Mobilize.js - 불필요한 파일로드 방지

나는 Mobilize.js framework을 사용하고 있으며 내 웹 사이트를 동원했습니다. 모든 것이 잘 작동하고 웹 사이트는 데스크톱과 모바일 모두에서 예상대로 표시됩니다.Mobilize.js - 불필요한 파일로드 방지

내 웹 사이트 버전에 약간 중량의 배경 이미지가 포함되어 있습니다. 그러나 동원 버전에 배경이나 다른 이미지를 포함시키지 않았으므로 저 대역폭 모바일에서도 최대한 빨리로드됩니다.

하지만이 직면하고있는 문제 웹 사이트가 모바일에 열 때, 여전히로드 것입니다 그것이이 동원 버전에서 필요하지 않은 경우에도 무거운 배경 이미지입니다. official documentation에 따르면 모바일 브라우저가 감지 되 자마자 이미지 및 기타 파일로드가 중지되어야합니다. 여기

은의 구조 페이지의 <head>

<script src="js/jquery-1.8.2.min.js"></script> 

<script> 
    //to define the structure of the mobile version 
    function mobilizeCustomInit() 
    { 
     ... 
    } 
</script> 

<!-- load the core mobilize js file --> 
<script type="text/javascript" src="/mobilize/js/mobilize.core.min.js"></script> 

<!-- set the cdn options --> 
<script type="text/javascript"> 
    mobilize.cdnOptions.baseURL = "http://mywebsite.com/mobilize"; 
</script> 

<!-- css stylesheet - CSS FOR DESKTOP ONLY --> 
<link rel="stylesheet" href="main.css">

mobilize.js 파일 후 (데스크탑 전용 배경 이미지 스타일이 정의) 내가 바탕 화면 스타일 시트를 포함 시켰 위 <head> 구조에서 분명하게 알 수 있듯이 . 따라서 mobilize.js 파일이 먼저로드되고 실행되며 "main.css"파일 (또는 최소한이 css 파일에 사용 된 이미지)이로드되면 중지되어야합니다. 그러나 일어나지는 않습니다.

그렇다면 모바일에서 웹 사이트를 열 때 CSS 파일의 데스크톱 버전을로드하지 않으려면 어떻게해야합니까?

출처

2012-11-05 GurjeetSinghDB

기준이 샘플 HTML 페이지 - 당신은로드 특정 모바일 JS와 CSS를 가질 수 있도록

<script type="text/javascript"> 

     // Called when mobilize.js is autoloading and init() is called 
     function mobilizeCustomInit() { 

      // Add new Javascript and CSS files to mobile 
      // file loading list 

      // Note: Slashdot at the beginning of the filename 
      // indicates that the file path is relative to the HTML file location. 
      // This is an internal trick of mobilize.js. 
      mobilize.cdnOptions.javascriptBundles.push("./mobilize.yoursite.js"); 
      mobilize.cdnOptions.cssBundles.push("./mobile-style.css");     
     }    
    </script>

를 호출해야 https://github.com/mobilizejs/mobilize.js/blob/master/integrations/example/sample.html

출처

2012-11-05 08:22:55

답장을 보내 주셔서 감사합니다. 그러나 mobilizeCustomInit()가 이미 선언되었고이 함수에서 필요한 모든 것을 호출하고 있다는 질문에 언급했듯이. 또한 모바일 특정 CSS 및 js를 지정하지 않아도 CSS 및 js없이 모바일 페이지를로드해야하지만 데스크톱 특정 콘텐츠는로드하지 않아야합니다. 내 관심사는 모바일 전용 콘텐츠를로드하는 대신 데스크톱 특정 콘텐츠를 피하는 방법입니다. – GurjeetSinghDB

오른쪽. 나는 당신의 질문을 올바르게 읽어야했다. –

Mobilize.js - 불필요한 파일로드 방지

답변

관련 문제