javascript - JQuery not loading in IE9 down -

my site http://www.thetruenorth.co.uk/

i can't jquery work on site in ie9 down. works fine in every other browser.

i've realised code below, detects if it's small screen (mobile), stops working. if remove bit, works. use because don't know how else i'd disable js mobiles, keep desktop. suggestions welcome.

$(document).ready(function(){ if(matchmedia('only screen , (max-width: 1023px)').matches) {} else {   code here      } }); 

i have feeling there's bug or i'm not aware of. please put me out of misery?

thanks

simple debugging in ie9

1. open ie9
2. press f12 open developer window
3. click 'script' tab
4. click 'console' on right pane
5. attempt load page

you see following error:

script5009: 'matchmedia' undefined  scripts.js, line 2 character 2 

ie9 not support 'matchmedia' function , not define it. attempting reference in code stops execution of javascript @ point because doesn't know reference undefined.

what going on

jquery loading on page. can confirm typing '$' text input line below console output , press enter. console output data how $ defined. sign jquery loaded. isn't conclusive in situations, 1 set.

what happening callback running ondomready (via $(document).ready(...)), erroring on first line. error causes rest of callback not execute.

verifying functionality support

you can use caniuse.com check see browsers support functionality (js, css, etc). in case: http://caniuse.com/matchmedia. note ie10 first version supports matchmedia function. can assume in earlier version not have matchmedia default , referencing cause errors.

what can now

on caniuse.com site, @ top horizontal list titled "resources". in area find ways patch browsers not support specific functionality.

in case of matchmedia there link 'polyfill' use custom js emulate functionality of matchmedia. url is: https://github.com/paulirish/matchmedia.js/.

polyfills have limitations or catches using them careful. interesting note matchmedia polyfill written paul irish, public figure web technologies.

a note on conditional ie includes

ie supports conditional comments, can include polyfill defined above specific versions of ie; in case < ie10. documented on mdn here: http://msdn.microsoft.com/library/ms537512.aspx

<!--[if lte ie 10]]>     <script src="polyfill.js"></script> <![endif]--> 

this done can use browser's implementation when possible (generally faster , potentially more functionality) , polyfill when needed.