Нужно сделать асинхронную загрузку CSS с помощью jQuery.
Делаю так:
<script>
$(document).ready(function() {
$("head").append("<link href='/wp-content/themes/theme1971/css/normalize.css' rel='stylesheet' >");
$("head").append("<link href='/wp-content/themes/theme1971/css/mobile.css' rel='stylesheet' >");
$("head").append("<link href='wp-content/themes/theme1971/style.css' rel='stylesheet' >");
$("head").append("<link href='/wp-content/themes/theme1971/css/mobile1.css' rel='stylesheet' >");
$("head").append("<link href='/wp-content/themes/theme1971/css/prettyPhoto.css' rel='stylesheet' >");
$("head").append("<link href='/wp-content/themes/theme1971/css/grid.css' rel='stylesheet' >");
$("head").append("<link href='https://fonts.googleapis.com/css?family=BenchNine:400,700,300' rel='stylesheet' >");
$("head").append("<link href='https://fonts.googleapis.com/css?family=BenchNine:400,700,300' rel='stylesheet' >");
$("head").append("<link href='https://fonts.googleapis.com/css?family=Roboto' rel='stylesheet' >");
$("head").append("<link href='/wp-content/themes/theme1971/css/slider.css' rel='stylesheet' >");
$("head").append("<link href='/wp-content/themes/theme1971/css/timer.css' rel='stylesheet' >");
});
</script>
Но как для некоторых стилей прописать media запросы CSS? Делаю так, но не работает.
<script>
$(document).ready(function() {
$("head").append("<link href='/wp-content/themes/theme1971/css/normalize.css' rel='stylesheet' >");
$("head").append("<link href='/wp-content/themes/theme1971/css/mobile.css' rel='stylesheet' @media screen and (max-width: 767px) >");
$("head").append("<link href='wp-content/themes/theme1971/style.css' rel='stylesheet' @media screen and (min-width: 1366px) >");
$("head").append("<link href='/wp-content/themes/theme1971/css/mobile1.css' rel='stylesheet' media=screen and (min-width: 768px) and (max-width: 1365px)>");
$("head").append("<link href='/wp-content/themes/theme1971/css/prettyPhoto.css' rel='stylesheet' >");
$("head").append("<link href='/wp-content/themes/theme1971/css/grid.css' rel='stylesheet' >");
$("head").append("<link href='https://fonts.googleapis.com/css?family=BenchNine:400,700,300' rel='stylesheet' >");
$("head").append("<link href='https://fonts.googleapis.com/css?family=BenchNine:400,700,300' rel='stylesheet' >");
$("head").append("<link href='https://fonts.googleapis.com/css?family=Roboto' rel='stylesheet' >");
$("head").append("<link href='/wp-content/themes/theme1971/css/slider.css' rel='stylesheet' >");
$("head").append("<link href='/wp-content/themes/theme1971/css/timer.css' rel='stylesheet' >");
});
</script>
