Jquery Doesn't Seem To Work in HTML5 Project

[Numinus67]

I'm not sure where i'm going wrong, but every time i write any jquery into my HTML5 projects they completely break. Below i have a simple function in jquery that breaks my project. When i check to see if jquery is loaded in the browser console, it says it is. What am i missing?

this.stop();
var root = this, tl;
var jqueryLibrary = document.createElement('script');
jqueryLibrary.type = 'text/javascript';
jqueryLibrary.async = true;
jqueryLibrary.src = 'https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js';
document.head.appendChild(jqueryLibrary);
function updateSize() {
  if ( $(window).width() < 739) {      
   root.gotoAndStop(2); 
  }
}
updateSize();

[ClayUUID]

"It breaks" is uselessly vague. What error message are you getting in the dev console?

Also, if you throw any of the HTML components on the stage, Animate will automatically include jQuery when you publish.

[Numinus67]

The page is opening up completely blank with nothing happening. I've tried including an html component. Still no dice. This is what i get in the console.

index.js?1485735818292:63 Uncaught ReferenceError: $ is not defined

    at updateSize (index.js?1485735818292:63)

    at lib.widthTest.frame_0 (index.js?1485735818292:68)

    at a.b._runActions (createjs-2015.11.26.min.js:17)

    at a.b.setPosition (createjs-2015.11.26.min.js:17)

    at a.b.setPosition (createjs-2015.11.26.min.js:17)

    at lib.widthTest.c._updateTimeline (createjs-2015.11.26.min.js:14)

    at lib.widthTest.c.advance (createjs-2015.11.26.min.js:14)

    at lib.widthTest.c._tick (createjs-2015.11.26.min.js:14)

    at a.b._tick (createjs-2015.11.26.min.js:13)

    at a.b.tick (createjs-2015.11.26.min.js:13)

[ClayUUID]

I just created a new blank Canvas document, threw a component on the stage and an alert($);, published with the default settings, and it worked fine.

[Numinus67]

Thanks ClayUUID.

Anyone else have any suggestions?

[Lucir]

I tried putting a component on the stage and it works only if I leave the component on the stage. What if you don't want a component on the stage? If I manually add the jQuery on the html page can I edit the jQuery in the action's panel?

[Numinus67]

is there NO ONE out there who can help with this?????? no one else has run into this problem? can anyone give me any ideas at all? i'm not using the code i posted above anymore. my project has changed quite a bit, but i'm still having problems getting jquery to work.

i've created an html5 canvas document with a bunch of elements and some javascript animation. everything works just fine until i try to add any jQuery code. i've tried to add a jqueryUI component to the stage so that the jquery library will be included automatically. i do this by drawing a square on the stage, selecting it, applying a jqueryUI code snippet, which turns the square into a movieclip and adds the code snippet to the actions.

whenever i publish this, all of my other elements are gone and only the square shows. nothing else happens.

wtf.

i figured out that if i take out my first line of code - this.stop(); - the project publishes correctly and everything works; however, i need to keep that line of code. it's necessary for me to stop the timeline on the first frame.

i can't figure out what the problem is. it seems unlikely that you can't have jquery code on the same frame as this.stop()., but is this just a fact of how animate works?

i really need to use some jquery in my project. but i can't figure out how to get this going. any help would be much appreciated.

thanks.

[ClayUUID]

I assume when all other elements are gone and only the square shows, you've opened the dev console and checked for error messages.

EDIT: Also, throwing some jQuery code on the timeline will not automagically cause the jQuery library to be included. The jQuery code snippets are intended for use with jQuery components, not random movieclips.

Regarding your code in the first post, I just noticed that you don't wait for the library to actually load. You kick off an asynchronous load request, then immediately try to use the library, before it possibly could have had a chance to load. Maybe setting async to true would fix things. I haven't tested this sort of thing.

Or you could modify your publish template to include a jQuery script load tag.