Chamar arquivo JS externo com base no valor de "tela de mídia"
Estou tentando isso, mas não está funcionando:
<html>
<head>
<script src="js/menu-collapser.js" type="text/javascript" media="media screen and (max-width: 599px)"></script>
</head>
...
</html>
//menu-collapser.js:
jQuery(document).ready(function($){
$('.main-navigation li ul').hide();
$('.main-navigation li').has('ul').click(function() {
$(this).children().toggle();
});
});
Você tem uma ideia de como fazer isso da maneira certa? O script funciona se usado diretamente no cabeçalho com as tags.