Thank you! If I can make one suggestion it would be to add somewhat at the end a demo of the final project. The first thing I do with tutorials is always to scroll to the end and see what I am going to end up with.
Thanks for the suggestion 1337biz. If you scroll down to "Your First jQuery Project" you should see the example we're creating in the guide. Let me know if there's anything else.
Nice! I actually used a horrible version of Street Fighter for my Intro to Programming course. We were learning conditionals, so I thought, "Why not teach them character selection and Event listeners?" A little confusing, but kept everyone interested.
No link, but I'll clean it up and email you a copy.
Its hideous, the gif's animation continues to repeat itself because the steps to play a gif once in VB is way too complicated. However, we built an onscreen gamepad so clicking left and right moved the character. It uses 3 BG stages and 3 characters (Ryu, Guile, and Chun-Li). I'll also include a link to where I got the gif's and sound effects.
While I applaud the time the author took to write this, isn't the message a bit misguided? Wouldn't it be more useful to encourage people to "Learn JavaScript and how to read an API"?
I think the tutorial is nice and does a good job demonstrating the power that jQuery offers over plain old JS. But if a newcomer to web dev came across this, it seems to not relay the point of what jQuery is: a JavaScript library. IMO, "learning jQuery" is a rather abstract concept and in the grand scheme, developers would be better off spending time with plain old JavaScript and making themselves familiar with how to read the jQuery API. I know this sounds rather "RTFM" of me, but that's not quite what I'm going for.
Good job on the tutorial. But I hope new-comers will look for JavaScript references for future education.
Consider caching your element selectors like this:
var $image = $('#my-div img');
This way jQuery doesn't have to traverse the DOM more than once to select the element.
Also, I believe you can do all of your mousedown() event code in one block.
Edit: oops, upon further inspection, I see you are doing this all in the console. Caching the selector is still possible, but now I understand why you did the mousedown() event the way you did.
What is the purpose of the opacity fade at the bottom? Stylistic? I'd really rather be able to see everything clearly. Looks like there is some good content otherwise.
31 comments
[ 2.9 ms ] story [ 70.8 ms ] threadDefinitely let me know if you have any feedback or suggestions.
Use the keyboard shortcut Command: Option + J (Mac)
doesnt work, as the shortcut seems to be Option + Alt + J.
Did the menu access change? Or is it still View > Developer > JavaScript Console.
</shameless plug>
Its hideous, the gif's animation continues to repeat itself because the steps to play a gif once in VB is way too complicated. However, we built an onscreen gamepad so clicking left and right moved the character. It uses 3 BG stages and 3 characters (Ryu, Guile, and Chun-Li). I'll also include a link to where I got the gif's and sound effects.
Good job on the tutorial. But I hope new-comers will look for JavaScript references for future education.
Will definitely check it out when I'm on my laptop, seems cool!
Let me know if you have any problems looking at it from your computer.
var $image = $('#my-div img');
This way jQuery doesn't have to traverse the DOM more than once to select the element.
Also, I believe you can do all of your mousedown() event code in one block.
Edit: oops, upon further inspection, I see you are doing this all in the console. Caching the selector is still possible, but now I understand why you did the mousedown() event the way you did.
Def let me know if you have any other suggestions :)