Можно ли создавать правила мультимедийных запросов "на лету" с помощью Javascript или jQuery?
Я использовал многочисленные медиа-запросы для нацеливания обобщенных видовых экранов и конкретных устройств/экранов с использованием встроенных CSS, импорта и связанных файлов:
@media screen and (min-width:400px) { ... }
@import url(foo.css) (min-width:400px);
<link rel="stylesheet" type="text/css" media="screen and (min-width: 400px)" href="foo.css" />
Я могу добавлять/удалять классы с помощью jQuery:
$("foobar").click(function(){
$("h1,h2,h3").addClass("blue");
$("div").addClass("important");
$('#snafu').removeClass('highlight');
});
Я также смотрю document.stylesheets
и, казалось бы, архаичный и специфичный для браузера:
document.styleSheets[0].insertRule("p{font-size: 20px;}", 0)
Но я не могу найти ссылку на программную генерацию:
@media screen and (min-width:400px)
из javascript напрямую или в любой форме.