2014-01-30 4 views
1

나는 modernizer.js & respond.js를 사용하여 IE8에서 미디어 쿼리를 구현합니다.respond.js 내부 스타일 시트 처리 가능

<!DOCTYPE html> 
<html> 
    <head> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
    <title>Modernizr test page</title> 
    <style type="text/css" media="all"> 
     @media (max-width: 500px) { 
      body { 
      background-color: blue; 
      } 
     } 
    </style> 
    </head> 
    <body> 
    Modernizr test page<br> 

    <script src="modernizr.custom.js"></script> 
    <script> 
     Modernizr.load({ 
      test: Modernizr.mq('only all'), 
      nope: '//cdnjs.cloudflare.com/ajax/libs/respond.js/1.4.2/respond.js' 
     }); 
    </script> 
    </body> 
</html> 

그것은 작동하지 않았다 :

나는 같은 내 페이지 (HTML & 자바 스크립트를) 코드.


나는 다음에 내 코드를 변경 :

<!DOCTYPE html> 
<html> 
    <head> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
    <title>Modernizr test page</title> 
    <link rel="stylesheet" href="myStylesheet.css"> 
    </head> 
    <body> 
    Modernizr test page<br> 

    <script src="modernizr.custom.js"></script> 
    <script> 
     Modernizr.load({ 
      test: Modernizr.mq('only all'), 
      nope: '//cdnjs.cloudflare.com/ajax/libs/respond.js/1.4.2/respond.js' 
     }); 
    </script> 
    </body> 
</html> 

그리고 별도의 CSS 파일 "myStylesheet.css"

@media (max-width: 500px) { 
    body { 
     background-color: blue; 
    } 
} 

그리고 그것은했다.


나는 respond.js Github page에 빠른 모습을 가지고 있지만, 내부 스타일 시트 참조가 지원되지 관한 언급 아무것도 찾을 수 없습니다.

내가 뭔가를 놓쳤습니까?

+0

안녕하세요. 좋은 질문입니다. 나는 똑같은 행동을하고 있고 흥미 롭다. – Rantiev

답변

0

내부 또는 외부 스타일 후에 respond.js를 연결해야하는 것 같습니다. 그렇다면 그것은 작동해야합니다!

+0

내 사례를 보면. 'Respond.js'가 코드의 마지막 항목으로 추가됩니다 (닫는'' 태그 바로 앞에) –