jquery - Call external JS file based on "media screen" value -
i'm trying not working: <html> <head> <script src="js/menu-collapser.js" type="text/javascript" media="media screen , (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(); }); }); do have idea on how in right way? script work if used directly in header tags. you can't directly using javascript <script> tags. media queries used in linked css files or inline css styles. basic example: <link rel="stylesheet" media="screen , (min-width: 900px)" href="desktop.css"/> <link rel="stylesheet" media="screen , (min-width: 571px)" href="tablet.css"/> <link rel="stylesheet" media="screen , (max...