Медиа-запрос проекции: поддержка браузера и обходные пути?

Question

Я пытаюсь применить стили к странице, только когда страница проецируется на стену (проектором, когда кто-то проводит презентацию). На данный момент, я могу получить это только в Opera в полноэкранном режиме.

Есть ли способ заставить @media projection влиять на другие браузеры? Кроме того, есть ли способ сделать его применимым только к проекции, а не к ноутбуку, с которого он проецируется?

Если нет, есть ли какие-либо жизнеспособные обходные пути к этому? Я пытаюсь создать слайд-шоу в css, но также предлагаю «представление докладчика» с дополнительными элементами управления на ноутбуке докладчика.

Любая помощь в любой окрестности очень ценится.

Answer 1

Если выходное значение проектора отличается от разрешения , чем у монитора вашего ноутбука, вы можете использовать медиазапрос CSS для управления отображением дополнительного элемента внутри каждого слайда с примечаниями для докладчика.

Например, допустим, размер ноутбука 1024x768, проецируемого экрана 1280x800, а заметки находятся внутри элемента с именем класса «notes» - вы должны сделать что-то вроде этого:

.slide > .notes
{
    display:none;
}

@media projection and (width:1280px)
{
    .slide > .notes
    {
        display:block;
    }
}

Это все равно потребует, чтобы проектор и ноутбук были разными экранами (как при использовании двух мониторов), но с учетом этого все работает - я сделал это по-настоящему.

Я использую Opera в полноэкранном режиме, когда я даю презентации;Я также использую приложение Mac OS X под названием «Mira», которое позволяет настраивать Apple Remote, чтобы оно отправляло нажатия клавиш приложениям.Поэтому, сопоставляя клавиши «Fwd» и «Back» на пульте дистанционного управления с «page-up» и «page-down» в Opera, я могу использовать пульт для пошагового перемещения по слайдам: -D

Answer 2

@media projection - абстрактное понятие. Практически projection может быть включен только на устройствах специального вида с пользовательскими сборками браузера.

На настольном компьютере / ноутбуке с проектором, подключенным в качестве внешнего монитора, браузер не может узнать, какой дополнительный монитор используется (если есть) для просмотра.

Единственный вариант для вас - поставить <button>"Fullscreen" mode</button> и использовать что-то вроде:

$(button).click( function() { $(document.body).toggleClass("fullscreen") } );

И использовать стили:

body { ... }    
body.fullsceen { ... }