2012-03-30 5 views
6

'반응 형'웹 사이트가 있지만 플래시 개체에 연결되기 때문에 '태블릿 환경'에만 있지 않고 'PC 브라우저'에서만 원하는 일부 링크가 있습니다.미디어 쿼리와 관련된 태블릿 환경

지금까지 내가 한 일이지만 더 큰 화면이있는 'Lenovo think pad'와 같은 일부 안드로이드 타블렛으로는 100 % 수정되지 않았습니다.

@media only screen 
and (max-device-width : 1024px)  
and (orientation:landscape) 
{ 
    header.Site 
    { 
     nav.Site > ul > li { line-height: 2 ; } 

     div.BidSessionCountdown, 
     a.LiveOnline { display: none; } 
    } 
} 

은 ... 당신이 생각할 수있는 모든 CSS 수정이 내 사이트가 반응하기 위해 미디어 쿼리를 사용하고이 내가 현재 사용하고 무엇입니까?

미리 Tash에 감사 : D

답변

2

미디어 쿼리를 사용하면 정말 플래시가 지원되지 않거나 경우에 감지 할 수있는 적절한 방법이 아니다. 내 제안은 자바 스크립트를 사용하여 이것을 결정하고 "no-flash"와 같은 body 요소에 클래스를 할당하는 것입니다. 자바 스크립트는 다음과 같습니다

//Using jQuery here 
if(typeof navigator.plugins['Shockwave Flash'] == 'undefined') { 
    $('body').addClass('no-flash'); 
} 

다음과 같이 될 수 귀하의 CSS는 다음과 같습니다

body.no-flash a.LiveOnline { 
    display:none; 
} 

참고 : 네비게이터 플러그인은 당신이 Here.

0

에서 온다 검사 자바 스크립트 코드를 오리엔테이션 : 가로 방향을 사용하면 키보드 팝업이 디스플레이를 변경할 것인지 여부를 고려해야합니다. 일단 너비 크기가 높이 크기보다 크면 CSS는이를 가로로 간주합니다.

관련 문제