So everywhere you look, you see “jQuery this” and “jQuery that”. For the last year or so, this library has been the darling of the Javascript world. But do you feel that you just can’t seem to learn the dang thing? Do you hate how the existing tutorials assume that you know WAY more than you actually do? If this rings true for you, I can help.
Starting today, I’m launching a daily video series that will teach you PRECISELY how to use the jQuery library in your own projects. We’ll start out by downloading the framework, creating our first function, examining syntax, and more. Every day, I’ll post a five-ten minute “training regimen” that expands on what you’ve already learned. So there’s no reason to fight it anymore! Learn this dang thing and start earning more money on ThemeForest.net with your new-found skills.
Day 1: Downloading the Library
To begin, we need to download the jQuery library. After that, we’ll get started with creating our first function.
Continue On…
- Subscribe to the ThemeForest RSS Feed for more daily web development tuts and articles.
John (Human3rror)
November 20th, 2008
freakin’ epic.
John
November 20th, 2008
Great start, looks really exciting!!
Mechanical Turducken
November 20th, 2008
Great post! This is a great resource for beginners.
Ariyo
November 20th, 2008
Jeff, This is awesome, I just subscribed to the RSS. I’m pretty OK with basics of jQuery. However, I am excited to start from scratch and work with to get a better understanding of how this library works. Thanks for doing this for us. keep em coming.
Jon
November 20th, 2008
Awesome! Thank you Jeffrey!
I’m really excited about this and looking forward to the upcoming screencasts.
Eliffio
November 20th, 2008
Grrrrreat tut! Man, your pretty didactic, I love that. You make it look very simple.
I really look forward to the upcoming tuts.
Thanks!!!!
sebastian
November 21st, 2008
Jeffrey you are the definition of awesome!
Owen
November 21st, 2008
Just what I was looking for!
Thanks Jeffrey!
Travis
November 21st, 2008
Great Tutorial! I was recently playing with a script that used the fadeout and wasn’t aware you could specify time in miliseconds, so this has already helped me!
Suggestion: post your source code for download. This tutorial is easy enough to write and follow along with but if the later videos are more indepth it would be convenient to have the code available to download and play with.
Owen
November 21st, 2008
Just an idea, would it be possible to provide the source code from the HTML file?
Just I was making one silly mistake and it took a while for me to figure out. I was using all normal brackets, instead of some normal, some squiggly.
I am a beginner :p
twoaz1
November 21st, 2008
Outstanding! Thank you Jeffrey!
Dan
November 21st, 2008
Excellent.
I’ve been meaning to get a hold of this jQuery malarky for a while and this has given me the push.
Thank you!
chris simpson
November 21st, 2008
great post. will be looking out for the series!
thanks!
Daniel
November 21st, 2008
Hi Jeffery,
This is just what I need.
Can you recommend a good video tutorial series for learning Javascript and PHP separately? I can’t seem to wrap my mind around it yet. I need a beginners video.
Thanks
trace
November 21st, 2008
great tut!
thanks
/trace
Jeffrey
November 21st, 2008
Hey Daniel. As soon as this series wraps up, I’ll be starting a similar PHP series.
For the time being, check out “30+ Eye-Opening Web Development Screencasts” from NETTUTS.com. It’s on the front page.
MKL
November 21st, 2008
Thank goodness for Jeffrey! As a young, beginning web designer your screencasts are the most helpful resources I’ve found yet. Can’t wait for the PHP stuff!
Blobby
November 23rd, 2008
Hey I wanted to ask you something, I looked for more of this Jquey stuff and I came across to this function
$(function() {
$(’a').click(function() {
$(’div.box’).slideToggle(1000);
});
});
this just slides in and out on click the problem is that it slides all the way up leaving no space I want it to fade up, however it should have 10px space up there.
Jeffrey
November 23rd, 2008
@Blobby - I’m not exactly sure what you mean. The way the code is written, your div with a class of box will slide up all of the way. If you simply want to change the height to 10 pixels or so, try researching the “animate” method.
Colleen
November 24th, 2008
Evaluating this versus dojotoolkit. already did scriptaculous, prototype, mootools to some extent. Need to see why Jquery is the best. Thanks the tut rocks.
Bennie Mosher
November 24th, 2008
Great series. Just out of curious reasons, why Windows? and most of all why Visual Studio?
Jeffrey
November 24th, 2008
@Bennie - Why not Windows? You don’t want to be one of those die hard Mac or Windows people. I personally use both.
And Visual Studio is a fantastic IDE.That’s why Microsoft puts so much money into it every year.
Bennie Mosher
November 27th, 2008
@Jeffrey I have used Visual Studio before and really didn’t care for it. I prefer something more along the lines of TextMate. Absolutely amazing and simple. Just a question out of curiosity.
I also was wondering if you guys could enable a function on the blog such as to follow the posts once you make a comment. So, that it would e-mail you when someone comments after yours. If you could enable that it would help a lot and I think make people return back to the site. Just a suggestion.
Jeff
November 30th, 2008
Why not Windows? That’s more of a loaded question that is relevant for this thread. I am personally a Linux proponent and will leave it at that. I do all my coding by hand and wouldn’t have it any other way.
The tutorial is definitely very good and thank you for it Jeffrey! Its an interesting view into the world of jQuery and certainly shows the added complexity of the syntax involved in doing jQuery coding.
Happy Holidays!
Jeff
Pedro Magalhães
December 6th, 2008
Thank You Very Much!
Steve
December 10th, 2008
Great beginner tutorial! I’m learning a bunch already. Am I the only one that giggled to himself when he saw the red box disappear?
So exciting!
Mohamed
December 10th, 2008
Nice start , Thanks .
Anthony
December 10th, 2008
I know some CSS and HTML, but i’m curious what are the tutorials that you are talking about?
v-render
December 11th, 2008
thank a lot for this informative tutorial.
I want to know how i can attach j-query java script path to a header.php for wordpress template. I don’t have much php knowledge.
Sanjiv
December 12th, 2008
This is very good video for beginner’s. I want to implement on real time with dynamic data using PHP. Please suggest me.
Troy
December 12th, 2008
I very much appreciate the tutorial. I have question, which may be similar to Blobby’s.
Once the DIV fades out, it looks to completely remove the DIV. Is there a way to make it fade out but still occupy the space, so the “Click” text does not move up.
Much like Display vs. Visibility in CSS.
I would like the JQuery fade out to where visibility is equal to none, not display equal to none.
Thanks
Aditya
December 13th, 2008
Hey Jeff,
Any reason why you wouldn’t release this in a downloadable format? We don’t have super broad broadband over where we are and i’d rather download this over night before watching it rather than in spurts. Also I like to go back and forth so I can try stuff out which is easier if the whole file is on my machine. Also makes it easier for me to show this to the rest of my developers instead of having them suck up bandwidth individually. You could put an overlay of your logo / copyright on the video to prevent loss of attribution.
Other great screencasters like Ryan Bates of Railscasts releases videos in MOV format and are immensely popular.
Thanks!!
Aditya
Jhay
December 13th, 2008
Nice article! I’ll watch your video tutorials. Thank you so much for great sharing!
Saro
December 13th, 2008
Hmm, really interesting. I’m not familiar with jQuery, but i might wan’t to learn it this holiday. Thanks for this great information, keep it up!
John
December 13th, 2008
Wow, I bought both Jquery books and I have had them for months and it is a real drag reading how to code Jquery, the books are solid but there is nothing like videos to make learning fun. Thanks for the time spent in making this great resource.
Kai Chan Vong
December 13th, 2008
Great series! Thanks for posting it. Just out of interest, what did you screen cast using on Windows?
- Kai
Gustavo Scanferla
December 13th, 2008
That’s great, thanks!
MikeSoertsz
December 13th, 2008
Hey all, if you want to easily download all these tuts automatically, search for the podcast NETTUTS in the iTunes Store. Good to have them on reference if you’re a beginner like me.
Keep em coming guys, awesome work.
Cheers!
luli
December 13th, 2008
Título de la web
#box {
background: red;
width:800px;
height:300px;
}
$(function() {
$(’a').click(function() {
$(’#box’).fadeout();
})
});
click me
Whats wrong with that? because it doesnt fade out…
Sean
December 13th, 2008
Just found this series through nettuts. Anyhow for me the first tutorial was easy, but that’s about as far as my knowledge extends and I’m looking forward to watching the rest of the series (in about 5 minutes).
One question, which program are you using to make the screencast. I really like that the mouse is highlighted with the yellow circle and would like to do that when I make screencasts for my students (my day job is language teacher).
Once again thanks for this series.
Rokurosv
December 13th, 2008
Very very nice, I’ve been looking for a newbie JQuery tutorial, I’m going to suscribe to the RSS for sure and spread the word on this nice tutorial series.
Thanks Jeffrey
liverpoolfc
December 13th, 2008
this is a very good tutorial that has sparked my interest in jquery. cheers!
Chris
December 13th, 2008
Fantastic! I am excited already!!!
Fer
December 14th, 2008
Hi Jeffrey great tutorial !
Help me a lot - very well done and easy to understand.
Fernanda
Marko
December 15th, 2008
Thank you, Jeffrey. Looks I’ll finally be able to get into jQuery.
savage
December 15th, 2008
wow.. this was really great !! I’ll def. be watching the whole series and looking forward to your PHP cast as well.
great job !!
highblood
December 15th, 2008
Thanks Jeffrey for these series of tutorials. I’m looking forward to learn since I’m new to web design/dev. Is it a pre-requisite that I master javascript? Or be really good in javascript to learn jQuery?
Dcritelli
December 16th, 2008
This didn’t work immediately for me. I had to look in the JQuery documentation to find out that $(document).ready needed to be added to the first line of the Javascript code. Don’t know what’s different about my setup but it wouldn’t work for me otherwise. Also when dragging the library from solution explorer into the document in Visual Studio 2005 all it did was create an href link, which is obviously useless. Not a big deal to type it out but still, it was a little different on my configuration. Good starting tutorial otherwise.
Jamie H
December 16th, 2008
That is awesome, thanks for the tutorial!!
Dave c
December 17th, 2008
Brilliant. As they say “KISS - Keep It Simple Stupid”
Too many site assume knowledge which can be frustrating when you find that they gloss over something because “you should know that”.
I look forward to watching the rest of the series.
Eray Alakese
December 17th, 2008
Hi,
thanks for this tut. Can’t we download this video?
Sara
December 17th, 2008
I agree with Anthony, what are those html and css tutes? I too am a newb, and it’s pretty confusing looking for a really good set of how-to’s when you’re just starting out with a very basic knowledge.
Indra N
December 18th, 2008
Hi,
I understand that the syntax of Javascript allows global variable and function definition. Where can I get more info about using $ sign in the statement inside the tag? Is this something new?
Jan Quickels
December 18th, 2008
Great work! I love your screencasts. They´re a wonderful resource for starting with jQuery. Thanks a lot!
浩翔
December 19th, 2008
hi, i’m from China, i can’t watch the vedio…
could u put the vedio to other vedio site? thank you !
saranya
December 19th, 2008
Resource is very good & thanks a lot for good beggining of jquery.
racoonwise
December 21st, 2008
why i can not see it?
milton
December 22nd, 2008
amazing. you’re are a life safer.
milton
December 22nd, 2008
saver*
Brian Kalwat
December 22nd, 2008
As per those who are asking about a way to maintain the space that the div would normally take up when it’s hidden - can’t you just use absolute positioning on everything as long as it’s within a container that has auto margins? This may not work if you’re trying to implement fluid width - but fixed width should work. Just a suggestion. Great series!
Josh
December 27th, 2008
Fantastic series! I’m home from school for winter break, and will be catching up on this series while learning JQuery
Thanks!
agus
December 27th, 2008
Hi.. Jeffry
I’am new to jquery. Is it Very usefull tutorial. Kep fire on making this video tutorial
Thank You
parminder
December 29th, 2008
Hi
I have just started with jQuery and I have to say its great to eventually find someone who can explain this in such a non geaky completely understandable way.
Thanks
Parm
Ro
December 29th, 2008
Hello,
thanks for the tut
Felix
December 30th, 2008
Excellent!
Easy to catch up : )
Ro
December 30th, 2008
One question.
I’m trying to do this tut myself copied all the code, great. Not quite sure where to put the jquery-1.2.6.pack.js?
Can I place in the same folder as my html, etc..?
If so how should I mark on the top of the html?
This is what I have now.
would welcome any suggestions.thanks
Jeffrey
December 30th, 2008
I recommend that you place your jQuery file in a “js” folder. You then reference it within the head tags like so:
<script type=”text/javascript” src=”js/jqueryFile.js”></script>
Ro
December 30th, 2008
Thanks for the time to explain that for me bur for some reason it still doesn’t lead to the path?
I have everything in folder have it labeled just as you mention but still no action?
Thanks for your patience and explanation.
RO
rik
December 31st, 2008
i think this is a great site love your tutorials just getting started in the http://www.
lov ing it.
DrupalDarlin
January 2nd, 2009
I’ve watched tons of vids and read documentation. Yours is the BEST step-by-step for jquery I have every seen.
Maple1249
January 3rd, 2009
Wow, what a great series! Thank you so much, JW! Your tutorials are incredible.
john
January 3rd, 2009
Thanks for taking the time to make this .! Very helpful.
KZ
January 4th, 2009
Hi, folks:
Why the vedio can’t be loaded in the page? The position where is supposed to be vedio is blank on both my PC and laptop.
Here is China btw.
Cheers
johny why
January 4th, 2009
hi again, you don’t have to post my comment about mistakes, i won’t take it personally! but if you refresh your videos, i’ll check them out! i did not make it through #1.
i’m sure most normal students have not problem at all with your minor slips.
regards
Rene Simons
January 5th, 2009
Hi,
I like your videos very much. I was not familiar with JQuery until two weeks ago so I’m very happy I found your site.
I noticed however you changed your presentation software and the quality of the sounda and picture is not what it was with camtasia. I’m sorry to say it is all very hard to follow now. Shame because I think it is all very helpfull.
Kind regards and a happy New Year to you!!
Rene Simons
The Netherlands
Atg
January 7th, 2009
a table of contents for each video would be extremely helpful, so users would know what topics are covered in each video..
Ken
January 8th, 2009
This jQuery video series is the best approach I’ve ever seen for getting a newbie started. Thanks so much for creating it.
M.khalid
January 9th, 2009
its really help full. Thanks you very much Jeffrey
normalfx
January 10th, 2009
Many thanks for your videos. It’s very useful for newbie like me.
salim
January 11th, 2009
thax jeffery nice from you to show as the magic of jquery i hope you can give us more & more
thx agive dear jeffery
Kim Andersen
January 14th, 2009
Niiiiiiiice, thank you very much.
I hate it when I see all the great effects on the web made by jQuery, but I don’t have a clue about what is going on, even when I look at the sourcecode. This i great
Mato
January 14th, 2009
Great tut!
This is my first time using JQuery! So far, so good!
Sean
January 14th, 2009
Awesome tutorials! Thank you for putting this together.
Nicole
January 16th, 2009
This was amazing. You break it down so much better than some text tutorials I tried to use but couldn’t get into at all. I squeed out loud when I got everything working.
I will definitely be checking out the rest of your tutorials on jQuery, and look forward to the PHP tutorials you’re planning.
Assem
January 16th, 2009
Great tutorial , thanx Jeff
Frank
January 16th, 2009
Dude - amazing post! I’m still a bit of a newbie, but I love me some jQuery! I just found this awesome jQuery Cheat Sheet for the iPhone today. It’s really great. I’ve only had it for a day and it’s already making my life a lot easier.
http://itunes.apple.com/WebObjects/MZStore.woa/wa/viewSoftware?id=302090867&mt=8
Looks like there’s also a CSS Cheat Sheet from the same guys.
http://itunes.apple.com/WebObjects/MZStore.woa/wa/viewSoftware?id=301093674&mt=8
Yuri
January 18th, 2009
Thanks alot!
Yoyo
January 18th, 2009
Yo man!
This video is real good man. Easy to understand how Jquery works. Thanks
OwlBoy
January 19th, 2009
haha, I could not get it to work and had the code exact cept for one thing:
I did not capitalize ‘out’ in ‘fadeOut’.
Be sure to do that!
-Owl
Jenniffer
January 20th, 2009
This is THE BEST tutorial I’ve ever seen! Thank you soooooooooo much!
Paul Denlinger
January 20th, 2009
Hi!
I can’t see your video tutorials in China. Wonder why? Can you host on Youtube?
Vivekanand
January 22nd, 2009
Nice Start and the tuts are excellent, this will help me a lot… Thanks for your effort on this, you rocks!
trekkq
January 22nd, 2009
awesome … 5 star for clarity and effort … good teaching too …
clicyu
January 23rd, 2009
Thanks,
This is great!!!
Xajin
January 26th, 2009
Love it, thanks so much, when will there be more ?
creat3tertiary
January 26th, 2009
This is great, thanks! don’t be afraid to dive into some of the theory for the designers among us who aren’t familiar with object-oriented languages (myself included!)..
Arantx
January 26th, 2009
I love you! thank you very much, you save the day!
gracias mil
b7s
Luke day
January 27th, 2009
Thanks alot for this, exactly what I needed to learn jquery.
Will watch when I get a chance!
Tarek
January 27th, 2009
Hi guys!
Great tut, but i cant seem to get it to work .
Could it be that im using a newer version of jquery and that somethigns have changed?
My code is identital to the one Jeffrey writes on this, yet i cant get my div to fadeout.
Anyone else experiencing this?
Ive tried some other jquery in the document im working in (found on the jquery site)…eg: a simple popup when i click the link, and that worked, however this doenst seem to work. Any help would be appreciated, im dying to get on with these tuts….thanks again and great job on these sites guys.
Jeffrey
January 27th, 2009
@Tarek - My guess is that you’re not referencing jQuery correctly. Do you have Firebug installed for Firefox? If so, load the page and press “F12″. Does it show an error?
Tarek
January 27th, 2009
Hi Jeffrey,
Thanks for your quick reply, I double checked and jquery is refrenced correctly. Its on the root of my site , i renamed it to jquery.js and linked it s follows:
No errors on firebug,also, i tried doing an alert on click and that works. However i cant seem to fadeout…its killing me lol i want to move on to the next vids i cant waaaaaaaaaait hehe. Great tuts.
Reblis
January 28th, 2009
How can I take the functionality of tutorial day 6 and add the speed and time from day 1?
Basically I would like to have an button or link that I roll over and have the ability to change the opacity and the speed in which it changes.
~reblis
Josh
January 28th, 2009
I need a little help. I’m familiar with the html, css and javascript. This is my first time using jquery. I code exactly what you did. It doesn’t work. I have also downloaded the source code from other tutorials, and I get the same problem every time. My html and css work, but nothing happens when I click the link. I can send you my code. Any help would be greatly appreciated.
(PS: I am programming with Sea Monkey on an ibook, if that is relevant.)
Daniel Correia
January 30th, 2009
Jeffrey you are the man!
Thanks
daoud Dajani
January 31st, 2009
some videos are not the right ones, day 2 day 3 and day5 are all the videos with the php login? why is this can you please check them.
thank you for you great work
acs8369
January 31st, 2009
It’s good and clear explain. Thanks
Jason
February 2nd, 2009
Great series - is it possible to download the clips at all? I’d like to be able to watch offline (iPhone etc).
Thanks in advance.
Jitendra Vyas
February 3rd, 2009
I don’t know javascript or any type of programming but i know HTML and CSS very well. can i learn jquery through this series withou knowing programming?
Arun Arangil
February 4th, 2009
Jeff, nice library and great stuff.Very impressive handling of the DOM.
Pierre
February 5th, 2009
Very nice work, and very useful videos !
These tutorials are just the best way to introduce jQuery …
Thanks you !
Victor Tolbert
February 6th, 2009
Very Nice Resource. Thanks for sharing.
The link to the ThemeForest RSS Feed, on this page, is invalid. There is an extra character “%22″.
Thanks
Lawrence77
February 7th, 2009
thanks man…
Very much useful, I’m a very very very newbie to JQuery….
Its very Useful!
GOD bless you too!
Harsha M V
February 7th, 2009
Aweosme… thanx… i always wanted to learn was where to start… now i know… where to… thanx Jeffrey
David
February 7th, 2009
Hello Jeffrey, First off, thanks for all the great tutorials that you post on the web. I was wondering if you have a good resource for J Query that will allow me to show random testimonials in a sidebar area.
Thanks.
Jeffrey
February 7th, 2009
@David - I wouldn’t recommend that you use jQuery for that. You can select random testimonials from your database. Are you using MYSQL, SQLSERVER?
David
February 7th, 2009
@Jeffrey - Thanks for the quick response, I wanted to show the testimonials on a static index page, but I am using MYSQL and SQLSERVER for the blog portion of my site on a sub domain with Wordpress. I will search for your idea and try to make it work.
Thanks
Jamel
February 12th, 2009
$function(){
$(’a').click(function() {
$(’#box’).fadeout();
});
});
it just wont fade out for me what have i done wrong
Ido Schacham
February 12th, 2009
These tutorials are ace, cheers!
Jeffrey
February 12th, 2009
@Jamel - Install Firebug for Firefox. After you load the page, press F12. What does it say? Is there an error?
My guess is that you aren’t referencing your jQuery library correctly.
caleb
February 12th, 2009
Can you add short descriptions about what is covered in each video? I am just starting out with jQuery and I have watched all the videos. But, sometimes I want to do something that I remember seeing it in one of the videos, but I can’t remember which one.
Thanks!
Benji
February 12th, 2009
why i can not see the flash anymore, try several times, flash section is empty~ feel sad
Hassan
February 13th, 2009
Hey Jeff! As you said that if you don’t know a lot of about CSS/HTML, then we should inform you… so please give me some cool resources? Thanks a lot buddy!
cdmanii
February 14th, 2009
Thank you very much ~
kryogenic
February 17th, 2009
thanx for a great tutorial.. i was looking at doing actionscript but a friend told me to do jquery because its alot better and he was right.. i was doing the above tutorial and for some reason it wasn’t working and i checked the code time and time again and even done the tutorial a few times.. it was the fadeOut what was causing the problem i had fadeout.. i guess certain keywords are case sensitive..
For people that want to learn php theres a great site over at http://www.phpvideotutorials.com theres alot of free lessons and some paid lessons too, a good community of people in the forum so if your interested i would consider checking them out
John
February 18th, 2009
Great tutorials
Any chance someone can amend this page so the days are marked with titles, would make dropping in and out a lot easier!!
Cheers guys!!
Edmon
February 18th, 2009
Thanks for this tut, realy good and teasty was it
Hamid
February 19th, 2009
thank you man.
its so good
Billy
February 19th, 2009
i don’t see the videos
Vincent
February 20th, 2009
Fantastic! Thank you sooo much. what a guy!
yinje2005
February 22nd, 2009
非常感谢你的文章啊！
R0bby
February 23rd, 2009
Hey.
I really like your Tutorials and i started with JQuery yesterday. Your Tutorials helped me a lot.
You talked about some special CSS Tutorials.
Could you tell me those?
Because i saw all your videos right know, and sometimes I don’t understand the css part. So I will go back to CSS and then i will continue jQuery.
Thanks in forward. :’)
realturk
February 25th, 2009
wooow great post thanx you jeffery
pat
February 25th, 2009
Just wanted to say thanks heaps for these tutorials! Definately one of the best series I’ve found! Very simple, very easy to follow and explains exactly what I needed to know. Thanks again! I’ll be back for more!!
brian
February 25th, 2009
Jeff,
I was wondering, is it a problem that we’re trying to create an HTML document? I’m writing all this in the code section of the document and the box doesn’t seem to be fading out. I’m having some serious doubts about starting this. But, the tutorials look and feel great. Thanks for all your hard work. But, please I am trying to figure this out. Going to post the code here:
/*help!
<script type=”text/javascript” src=”
#box {
background: red;
width: 300px;
height: 300px;
}
$(function() {
$(’a') .click(function() {
$(’#box’) .fadeOut();
});
});
Click Me
please!*/
R0bby
February 26th, 2009
How can i actually access your email?
Cause link to your profile isn’t working at the moment.
Wanna add:
Now i could figure out some things in jquery i couldn’t before.
So thanks for this help.
What jeffrey’s email btw?
Robert DeBoer
February 26th, 2009
Um, Jeff, did you every do the second part of day 12? Maybe I’m missing it, but I don’t see it.
Cato
February 27th, 2009
I am leurning jQuery in collage just now, and these video’s are really helpfull.
But is there no way I can download them to my computer?
Because we are not always allowed to go on the internet.
Thank you so much
goonerholic
March 1st, 2009
Your video lecture helps me a lot
Thanks!!
本草纲目
March 5th, 2009
我也喜欢jQuery
Joel
March 5th, 2009
Never touched a lick of Java before, yet thanks to you and Vimeo- I am learning something new that I can finally use on my WP site
thanks J Q
leo
March 5th, 2009
I can’t see the video too.Why??
Chuck
March 7th, 2009
I Jeffrey,
Great tutorial. I only wish I could get it to work successfully. I’ve designed a few websites out of necessity not as a trained professional. I’ve always used WYSIWYG tools. HTML experience: miminal… CSS experience: none
I was impressed by the tutorial because day 1 is close to an effect I’ve been trying to figure out.
My box does not fade when I click the text link. Maybe someone with more experience could spot what I’m doing wrong in this code.
thanks
chuck
#box
{
background: red;
width: 300px;
height: 300px;
}
$(function() {
$(’a').click(function() {
$(’#box’).fadeout();
});
});
Click Me
Sean Smyth
March 7th, 2009
Thanks for this. I’m slowly making my way through these. Thanks.
david_mac
March 8th, 2009
Hi, great tutorials
Just one thing puzzling me though. You start your jQuery code like this:
$(function() {
But in all the other tutorials and books I have read on jQuery it is usually started like this:
$(document.ready(function () {
What is the difference between these two and why use the second if the first works?
YoonMi
March 9th, 2009
I would’ve love to view these tuts but for some reason - they aren’t loading…ugh!
Is there anyway to download them?
Chris Barnett
March 11th, 2009
Wish I would have found this sooner. I have begun a two week adventure. Goal is to make great things for Theme Forest. Wish me luck! ; )
MegaFill
March 11th, 2009
Oh. Im only starting learned JQ… tnx!
faLco
March 14th, 2009
Hi ! I’m french but your tutorials have been very useful for me because i’m currently working on a jQuery project !
Thanks and carry that way !
Angelina
March 17th, 2009
thank you so much!!!
Chris
March 18th, 2009
You did a wonderful job with this. Thanks very much for making it available.
...
March 20th, 2009
This screencast really helped me get started with jQuery. Thanks a million, Jeffrey!
Mike
March 21st, 2009
Great presentation - good voice, good pace!
And thank you for using Visual Studio - one less variable I have to learn.
Cheers!
Omar
March 22nd, 2009
Great series. Am extremely valuable resource for newbies like me!
Thanks a lot!
Piter
March 23rd, 2009
Video is very nice. THANKS!!!
Now I can use jQuary easy!
RP
March 23rd, 2009
You are great!
David
March 26th, 2009
Firstly amazing Video tutorials, I will be watching the whole set. But I seem to be stuck at the first hurdle. When I click the the ‘Click Me!’ anchor, nothing happens! I have definitely referenced everything correctly and am testing on both Firefox 3.0.7 and Ie 7. I have renamed jquery-1.3.2.min.js to jquery.js and it is in the root folder. I have double checked for syntax errors and there are none. Please help because I really want to move on to the next tutorial.
thanks,
Dave
Flor Jimenez
March 28th, 2009
This one of the best site for tutorial , I have seen. I am just curious to know about jsquery and I am not aware that there is such web page offering a very intensive tutorial (sound and slides) as well as complete source documentations. Thank you very much. I hope all the sites are made like this.
Great job!!!!!!!!!!!!!!
Flor Jimenez TX
Software Developer
Karsten
March 30th, 2009
Thank you for this great tutorial! I’m really impressed.
It’s not only very informative about jQuery but also an inspiring use of camtasia for online-software-tutorials. Now i have to decide which of the two inspirations i follow up first.
Karsten
Masud Ibn Afjal
April 1st, 2009
Great tutorials @ also great Post
Its really helpful for absolute beginner …
Thanks for help Us……
James
April 2nd, 2009
I am doing day 1 sample in eclipse IDE and i am getting an error that says “A Runtime Error has occured. Do you wish to Debug? Error : Object expected”
Here is my code. Any comments?
Insert title here
#box
{
background: red;
width: 300px;
height: 300px;
}
$(function() {
$(’a').click(function() {
$(’#box’).fadeOut(fast);
});
});
Click me!
creadionizor
April 7th, 2009
Hey Jeffrey,
I’ve been following several screencast series, I really like them and they really helps a lot. The point is i’m new into coding and stuff. You were talking about great css/html tutorials that you would send people if they needed them. Well if you wouldn’t mind please send them to me.
Friendly greetings
Creadionizor
luckyluck
April 13th, 2009
Good tutorial. I’m learning Jquery, I need this tutorial.
thanks you !
Tony
April 17th, 2009
Hi Jeffrey and thanks for the tuts.
You did show jQuery can be easy to use even for beginners.
That’s my first try of jQuery and I spent several days working on it and I’m happy I made my ideas come true.
I wrote a small game, I call it “15″ (Fifteen), maybe you call it the same
here it is
http://www.tonyspb.ru/tonyphp/jquery/15/04.html
Poster movie man
April 18th, 2009
Hey great tutorial. For some having problems.
I had to reference the file using this line. It was killing me for about 30 to 40 min. Good luck everyone.
Philip Downer
April 19th, 2009
Considered posting the JS and HTML from each of your tutorial videos? Would be a nice jumping off spot after each screencast.
Adam Winogrodzki
April 19th, 2009
wow ! again a great tutorial
sohbet
April 20th, 2009
thanks for you
Ash
April 21st, 2009
Hi there
Ive been looking all over the place for a guide on how to ” Resize div tags/layouts and Text via some sort of Jquery slider”, would this be possible using Jquery and if so would you be able to show us how, this would be great from a accessibility point, also would be cool if you could show us some website skinning with jquery
Many Thanks for any pointers or info
tempe
April 23rd, 2009
great….!!!!!!!!!!!!!!!
Peyman
April 23rd, 2009
Thank u so much for tutorials ,,, i am waiting for new video ,
Zeck
April 23rd, 2009
Wow, Greate tutorials. Thank you.
Best regards,
Zeck
Maysam
April 24th, 2009
I am using VS2008 pro and I dont know y IntelliSense for jquery does not work for me?
Joe
April 25th, 2009
Awesome Tuts..
is there anyway that once you press the click button so the box slides up can you click the button again for the box to reveal itself? so you dont have to refresh the page?
Thanks,
Joe
AhmetSali
April 25th, 2009
Thanks, you are doing a great job.
adai
April 25th, 2009
very good！！but why can’t I watch it!The flash does not load at all.IS that because I am in china?
kikids
April 26th, 2009
cool, start to learn jQuery. Thanks a lot.
Kaan
April 27th, 2009
Your jQuery tutorials are awesome, I just wanted to say thanks buddy.
Prakash
April 28th, 2009
Hi,
Its great i love it please post as much u can we all are waiting…………
great thank you very much please keep on post
Andrew Donald
April 28th, 2009
Could you please please do a beginners guide to jQuery UI Tabs. They’re an absolute nightmare to understand, and I haven’t come across any website that does justice in explaining them properly.
They’ve put me off jQuery for life and caused me a world of hurt…I am suicidal (almost!)
Altaf
April 29th, 2009
Hello Jeffery,
I have just downloaded “jquery-1.3.2.min.js” & added the file to my current project in VS 2008 but, I am not getting the $ notation of Jquery without which I cannot go ahead..
Plz help me…Thnx in advance.
steve
April 29th, 2009
hi Jeff,
i have just come across your tutorials. at last there is someone out there who doesn’t assume the student knows anything! so thank you for that.often times i spend most of my life trying to figure what the hell the tutor means.
i’m having a problem opening the jquery file. i’m using vista home premium.
i can download it but then when i try to open it i get the following windows script host warning:
Script: C:\XAMPP\xampp\htdocs\jQueryTutorial\jquery 132.min.js
Line: 11
Char: 13
Error: ‘window’ is undefined
Code: 800A1391
Source: Microsoft JScript runtime error
I’ve tried different versions of the jsquery file but get the same result.
I see that after the download is the following bit of advice:
SHA1 Checksum: 1be9c3684054001f53fa7ff6d85ec3cb573a9cd2
Tip: Use the SHA1 checksum shown to verify file integrity.
I’m guessing this may have something to do with it, but if it has i have no idea how to use it.
any advice please
Steve
Brad
April 30th, 2009
Literally just stepped into this blog, but was so excited to see someone willing to level with me finally about jQuery I felt impelled to say thank you immediately!!
Jordan Garn
May 1st, 2009
Excellent job, keep it up, very helpful.
Mausay
May 3rd, 2009
The first minutes are kinda worthless. you’re basically only promoting the series. second, why start with visual studio? An “absolute beginner” probably starts with notepad++ or dreamweaver.
ignoring these downsides, great introduction
Keith D
May 4th, 2009
Just found this resource…
Looks fantastic.
I’ll work my way through and report back.
Keith D
من و متعه ام
May 8th, 2009
if any one want the direct link to these 15 video, contact me by my yahoo id; mafzool
Codie
May 9th, 2009
Love these series, thanks, keep up the good work.
Vik
May 12th, 2009
hey i got the error when should i runt the first video lecture code .The error shows me load time error and Object doesn’t support method or property.
Vik
May 12th, 2009
please guy help me out..
rayan
May 13th, 2009
Hi jeff
Your tutorial really made my day….But Could you please tell how did you rotate the window screen at the start of the 13th and 14th day video????? I really wsih to know……Thanks
Noblain
May 14th, 2009
Thanks a lot dude
charlie
May 15th, 2009
Thanks, we all gotta start somewhere…
hendra
May 16th, 2009
very nice tutorial.. i’ve been using javascript and AJAX for quite some time, but never using AJAX framework. turns out to be so fascinating =))
Kelvin Lim
May 16th, 2009
AMAZING tutorial i am quite a beginner and many site assume you know everything….i know some css but when i read the Jquery documentation i have absolute no idea what those are…$(function wth is this anyway
Now with your vid tuts it all makes sense to me.
This is just better than other more popular sites with tons of jquery sample but without explaining how it works.
Baba
May 17th, 2009
Thanks for putting this together. We’re loving it!
Saurabh
May 19th, 2009
thanx for these nice videos
please upload some more videos of jQuery with Asp.Net like ajax call , getJSON,$.ajax(), $.get() functions
Kind Regards,
Saurabh
Will
May 19th, 2009
Hi! I must say that I am very exited about these tutorials. Thank you for taking your time, and posting, what seem to be, very helpful and educational videos. One problem though, the first video dies about 2 minutes in. I wish I could see it, as it is the intro. Regardless, thanks!
bryan
May 19th, 2009
you guys are doing it, and you’re doing it right.
if i would have had these kinds of resources when i first started programming…
thanks for all your hard work on this.
Sean
May 19th, 2009
This is great!!! Thanks!!!!!
Kerry
May 20th, 2009
Hi,
I just started out using JQuery, I can’t seem to get this tutorial going in eclipse, and firebug also gives an error ‘$ is not defined’ can someone help!
Hans
May 22nd, 2009
Hello Kerry,
Sounds like you forgot to include the jQuery .js-file. The Day1 Tutorial explains how to do so.
Also this tutorial shouldn’t be “going” in eclipse anyway, for eclipse is just meant for editing files and javascript doesn’t need to be compiled by it. Edit in eclipse, test in firefox.
andrew
May 23rd, 2009
Like a few on here it wouldn’t work at first and i was like what?
remember its fadeOut()
CAPITAL O!!!
greatterrakomp
May 24th, 2009
Hello, everyone! Nice forum, nice discussions!
Can you, guys, tell me how i can upload an avatar so that it could be displayed with all my posts? i’m just newbe in using forums and can’t find this feature here.
P.S. i’m sorry, may be i’m posting to the wrong category, but i just want to use all features of the board.
theway
May 24th, 2009
Hi all blog.themeforest.net !
http://img337.imageshack.us/img337/4988/newsc7ucbcrjda7885vx1.png
Create your site on SLAED CMS! SLAED CMS is an easy site with minimum requirements for server, high levels of protection and a great choice for the creation of a site of any complexity! SLAEDOpen is an Open Source (Licence GPL 3).
Language: Russian, German, English
Size: 3.98 MBytes
V.: 1.1
Download: http://slaed.net/uploads/files/public/open_slaed.zip
Producer: http://slaed.net/shop.html
Bye for now!
Poerowaporp
May 25th, 2009
buy virginia slims ultra phosphorescence cigarettes
second-rate doral cigarette cheap doral cigarette|trashy doral cigarettes
cheap doral cigarettes two-bit doral cigarettes
cheap gpc cigarette cheap gpc cigarettes
tight gpc cigarettes budget-priced gpc cigarettes
discount doral cigarettes
Kristopher Sarratt
May 25th, 2009
Great stuff…thnx! So many of the jQuery tutorials out there assume you know so much before you even begin (i.e. JS and PHP)…this really brings it down to a very easy level and works up.
chinthaka
May 25th, 2009
Hi Jeffery Thanks for the post from the very first post i learned many things & you have a nice teaching voice..
Sri Lanka
Mohmaed
May 26th, 2009
Thank you so much for your help, this is absolutely amazing.
Trying to learn all this from scratch is very difficult, but with your help I think I can do it
Thanks again.
santhosh
May 26th, 2009
hi , these videos very good. I want to download . how can i download these videos.
mail me at santhosh_247(at)yahoo.co.in ……..
Mark
May 27th, 2009
Awesome series! tho i have one guestion. How i can make a script that gets ID of the clicked link and toggles whit the same id?
could you reply to my email?
chris
May 29th, 2009
These are the best introductory jquery tutorials available on the net! Jeff is a very talented teacher. Are these available for download?
indi
June 3rd, 2009
T_T i wanna learn how to upload files using Jquery, please help.
Nike
June 4th, 2009
Hi, can you please upload the source code too?
Javascript Guy
June 8th, 2009
This series is the definitive introduction to jQuery for us webmasters that are not deeply experienced programmers. Highly recommended.
Richard
June 9th, 2009
Great videos! I’m not a CSS whiz and don’t know the DOM as well as I should, but I followed prefectly.
Could you explain the “load” syntax (Why we put everything in a $(function() {). And what exactly “$” is doing.
I’m coming from this with no Javascript experience, let along JQuery. An introduction to Javascript (from the beginning - i.e. syntax) might go hand-in-hand for people coming into this fresh.
Thank you!
krisjohn
June 10th, 2009
Great tutorial… Can I download your video tutorial in JQuery? I don’t have any internet connection at home. I am learning JQuery. I am a beginner in programming. I want to learn JQuery. Thanks!
Robert Jackson
June 11th, 2009
Just thought I’d add my appreciation to the list here. Thanks.
SilverFirefly
June 15th, 2009
Hi,
Is there a text version of these tutorials? Or an alternative tutorial (in text, not video)?
Nike
June 15th, 2009
Can you please have an demo TreeMap? Am very keen to learn it
Tony Kenobi
June 19th, 2009
Hi,
This is a really great set of tutorials that almost anyoine could follow. The only real prerequisite is a knowledge of html.
Keep up the great work.
Tony
brahim arabe
June 21st, 2009
waiting for tuto 16 ;D
Jeff
June 24th, 2009
Lots of information, very helpful for absolute beginners to get their feet wet with this powerful library
Brad
June 26th, 2009
Thank you so much for introducing me to jQuery! This is one of the best jQuery video series on the net. When are you planning to release the intermediate series?
shawqi
June 28th, 2009
since three day I no longer watch this fantastic series
please tell me why?
and if there is a problem please try to fix it because I enjoy your video so much
Ann
June 28th, 2009
So many comments, and yet I still have to add mine. Fantastic set of tutorials here. Thanks so much, and I have subscribed to your site!
midavis
June 29th, 2009
I can’t see the videos at all for some reason. I have the latest version of flash. It just shows a blank image where the flash content should be.
atef
June 29th, 2009
if you please, i want to download these videos because i want to learn jquery ?
Denimpoo
June 30th, 2009
Thanks for the tutorial. However, I too ran into problems using your script. I couldn’t get the effect to work with the code as is. I’m not very well versed code wise but the following is what I used to finally get it to work.
$(document).ready(function(){
$(”a”).click(function () {
$(”#box”).fadeOut();
});
});
Note the ” instead of ‘ and the ‘o’ in fadeOut HAS to be capitalized. I scripted this within Dreamweaver CS3.
Hope this helps for those of you running into the same problem I did. Good luck!
Denimpoo
June 30th, 2009
Whoops! I forgot to add this as well. I couldn’t get the jquery-1.3.2.min.js from jqeury.com to work with my file either and found snippet within the js library in Dreamweaver. Lo and behold, a fading box!
Hanush H Nair
July 5th, 2009
Can you give a downloadable copy of the whole series.
vype
July 6th, 2009
better to start here instead of jquery.com!
marcin
July 8th, 2009
Ok, great! First lessons and it’s not working
Nothing is happening when I click the link. Jquery version I use is 1.3.2
marcin
July 8th, 2009
Ok, it works now with 1.3.2. I followed Denimpro’s advice and used “fadeOut” insead of “fadeout”
Thank you my friend
mojitopl
July 9th, 2009
Of course… GREAT!
the best award for You Jeffrey is a fact that when at the end of this lesson You encourage to subsribe to RSS there is “680″ readers. When I finished this tutorial today it was 10613… CONGRATS!