1

I've never had a problem until recently, but for some reason when I link my JS files, they won't execute at all. jQuery works, but any files that require jQuery such as easing, and other concept files, they refuse to run in any browser on my machine.

But, here's the odd part. If I wrap all my code in 'script' tags within the HTML document, everything works fine; no issues, bugs, anything. (jquery.js is still linked to the document too).

I'm using Dreamweaver, which tells me they are correctly linked. I'm totally lost by this, I can't work it out.

Here's the HTML: http://jsbin.com/iyagub/1

I don't understand what could cause the JS files to not work.

I'm running it locally, but not on localhost, instead via Windows Explorer. I'm on Windows 8 64-bit. I'm not sure if this is a security issue, but I can't see how as I've said; it all worked fine before like any other project I've worked on.

Remember, if I paste any of the code from the linked JS files in to the HTML document directly with script tags, it works flawlessly.

Does anyone have any idea what it could be?

  • 3
    My guess is that, when you deploy your site, the path to the JavaScript files is not correct. (You can test this by looking at the errors you get from the site in something like the Chrome JS console.) The relative path is, most likely, wrong. – JasCav Nov 27 '12 at 17:36
  • I'm guessing that the `src` links aren't resolving correctly. – Shmiddty Nov 27 '12 at 17:37
  • They're linked; check with Firebug & Chrome Console. Just realized it's now saying "ReferenceError: $ is not defined in [Break On This Error] $(document).ready(function() {" and "ReferenceError: jQuery is not defined in [Break On This Error] jQuery.easing['jswing'] = jQuery.easing['swing'];" - what's the reason for this? – user1470037 Nov 27 '12 at 17:41
  • Is jquery.js be above all your dependencies? – chaseadamsio Nov 27 '12 at 17:43
  • @realchaseadams - Thank you! For some bizarre reason I never noticed this. Simple things make school boy errors, eh? jQuery was at the bottom of all the jQuery dependent files. Thanks! – user1470037 Nov 27 '12 at 17:47

2 Answers2

1

In your JSBin example:

<script src="js/script.js" type="text/javascript"></script>
<script src="js/totop.js" type="text/javascript"></script>
<script src="js/easing.js" type="text/javascript"></script>
<script src="js/menu.js" type="text/javascript"></script>
<script src="js/jquery.js" type="text/javascript"></script>

Change the order to:

<script src="js/jquery.js" type="text/javascript"></script>
<script src="js/totop.js" type="text/javascript"></script>
<script src="js/easing.js" type="text/javascript"></script>
<script src="js/menu.js" type="text/javascript"></script>
<script src="js/script.js" type="text/javascript"></script>

Your problem arises from jquery not being loaded into the document before other scripts try and use it.

Tyzoid
  • 1,072
  • 13
  • 31
chaseadamsio
  • 883
  • 5
  • 11
0

If you open your URL in a browser with an opened console: e.g. Firefox + firebug you will notice some of your scripts are failed to loading.

For example : http://jsbin.com/iyagub/js/easing.js is not found.

This could be due to many reason: Wrong paths? Wrong server configurations? A misplaced .htacces with bad Rewritecond -s ?

kante
  • 229
  • 1
  • 4
  • 13
  • I don't believe jsbin "pulls" files from a js directory, so you're right that they're not being found. When using jsbin for real code examples, if you want to utilize any libraries, you have to add libraries in the top left navigation. Good catch, though! – chaseadamsio Nov 27 '12 at 17:51