Таблетка, специфичная для медиа-запросов

Question

У меня есть «отзывчивый» веб-сайт, но есть некоторые ссылки, которые я хочу только в «браузерах ПК», а не на «планшетах», потому что они соединяются со вспышками.

До сих пор это то, что я сделал, но это не 100% -ное исправление, как некоторые планшеты Android, такие как «Lenovo Think Pad», которые имеют больший экран.

Я использую медиа запросы, чтобы сделать мой сайт отзывчивым и это то, что я в настоящее время с помощью ...

@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 исправления вы можете думать?

Спасибо заранее Таша: D

Answer 1

Использование медиа запросов не очень подходящий метод для обнаружения, если вспышка поддерживается или нет. Мое предложение было бы определить это с помощью JavaScript и назначить класс элементу body, например «no-flash». Ваш JavaScript может выглядеть следующим образом:

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

Затем ваш CSS может выглядеть следующим образом:

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

Примечания: В яваскрипте код, который проверяет навигатор плагин приходит от Here.

Answer 2

Когда вы используя ориентацию: пейзаж, вам нужно подумать, будет ли всплывающее окно клавиатуры менять изображение, как только размер ширины больше размера высоты, css будет рассматривать его как ландшафт.