Может ли jQuery изменить CSS для определенного типа носителя?

Возможно ли, чтобы jQuery изменил CSS для определенного типа носителя (например, для печати)?

Моя особая проблема заключается в том, что я использую анимацию для элемента и переопределяю таблицу стилей печати, которая разрушает мой макет печати. Хотя моя проблема несколько отличается от поставленного общего вопроса, я думаю, что ответ должен помочь мне решить мою проблему. Также были бы полезны любые возможные обходные пути. Очень важно.

Ответ 1

Вам не нужно делать это с помощью Javascript. Просто используйте правило @media в вашем документе css. Вы можете написать все эти материалы только в одном файле css. Вот конкретная Документация W3C

@media screen {

/* all your fancy screen css with a bunch of animation stuff*/

}

@media print {

/* all your fancy print css just plain */

}

Вы можете написать очень конкретные объявления и сопоставить все элементы с вашими потребностями. Btw он поддерживал до IE6. Работает как прелесть в наших проектах.

@media print {
   body { font-size: 10pt }
}

@media screen {
   body { font-size: 13px }
}

@media screen, print {
   body { line-height: 1.2 }
}

Ответ 2

Добавьте css для вашего носителя (печать) с определенным правилом, которое скрывает элемент (например, #div {display: none;})

В вашем script, если это:

$('#div').is(':visible')

истинно, тогда вы находитесь на печатном носителе (печать).