Grow your CSS skills. Land your dream job.

#20: Introduction to jQuery

The popular JavaScript library jQuery is an amazing way to extend the design possibilities of your site beyond what CSS can do. But luckily, if you are already comfortable with CSS, you have a huge head start in jQuery! This is a very basic introduction to including jQuery on your web page and getting started writing a few functions.

Links from video:

Make sure to check out Intro to jQuery 2, which expands on these ideas and has it's own demo and downloads.

Comments

  1. Prabhakaran
    Permalink to comment#

    Hi Chris… Good intro about jquery..

  2. Phillychris
    Permalink to comment#

    Hey, Chris! Great intro about JQuery. I just downloaded it yesterday for animation for my photos. I am trying to apply it to my webpage. This tutorial is great insight to JQuery for a novice like me!

    PhillyChris

  3. Permalink to comment#

    Hey Chris,

    Thanks for the work… I tried to duplicate these examples to get my feet wet and they only work for me in Safari… Firefox and Camino reject the JS and pretty much don’t do anything at all.

    Do you have any suggestions as to why they wouldn’t work correctly?

  4. charliechin
    Permalink to comment#

    Awesome Tutorial, dude!:D

  5. Permalink to comment#

    Your tutorials are really great Chris! the tutorials leave no option of asking any furthur questions :P Thanks! ;)

  6. britta
    Permalink to comment#

    Hello Chris,
    thanx for your nice tutorials. It took me hours with not understanding jQuery in school… With watching your tutorial I have a idea about it now.
    Thanx from Britta (Hamburg, Germany)

  7. PixeltoDesign
    Permalink to comment#

    Chris this is such a great resource! You continue to help me learn new items each time I visit. Please Please Please keep up the amazing work you do.

    Also maybe more jQuery video tuts in the future. Or Even Ajax or Prototype tuts.

  8. Tiago Pregueiro
    Permalink to comment#

    Here is the source code, which I’ve created while following this great tutorial! Thnks Chris!

    http://tiagopregueiro.net/jquery-intro.zip

  9. Noirfatom
    Permalink to comment#

    Great intro for a newbie like me. Really clear. Good job. I’m looking forward to see more of tutorials like this.

  10. Ahmet basaran
    Permalink to comment#

    Hi Chris,

    Thank you Great intro about JQuery.
    Ahmet BASARAN – Turkey

  11. yasin
    Permalink to comment#

    Thank for the intro and advertising :)

  12. Permalink to comment#

    Thank you for this tutorial. Simple yet clear.

  13. beatifully done chris

  14. Saniyusuf
    Permalink to comment#

    Great Great Tutorial

  15. pablo
    Permalink to comment#

    this is great help, amazing man, thanks a lot from argentina

  16. Khalid
    Permalink to comment#

    Hi Chris. A couple of years ago I started to learn HTML and CSS. After that I expanded my skills with ‘mastering’ WordPress. A few weeks ago I decided to learn JavaScript (main focus on jQuery od course) and PHP. The problem is that I couldn’t find good tutorials for the VERY beginner. But guess what; I just found the perfect tutorial for a jQuery beginner. I’m looking forward to watch it again and write the code myself and then I’ll watch screencast #35, which is the second part.

  17. MYK
    Permalink to comment#

    Hi Chris! I am having some problem with the newest jQuery js. I copied the whole script and paste it into a js file. I linked the script with my html file and tried the stuff in the video. However, I could not get the effect. Every time i pressed the Action 1 button, nothing happened. What’s going on? Or how could i send you my files so you might be able to help me when you’re free?
    Thanks!

  18. Great tutorial! Really helped get me started with jQuery!

  19. Rune

    awesome. thanks, really helped me get my head around jquery

  20. SAMI
    Permalink to comment#

    Pal, keep making these videos. I’ve gone from being scared of JQuery to actually beginning to grasp it. Many claps.

  21. Permalink to comment#

    Once again Chris. This is a nice start after ending up my css tutorial. I have actually seen all the basic examples of w3schools, but still i am not satisfied as i need to learn it as much quickly as possible. Because my next step will be PHP.

Leave a Comment

Current ye@r *

*May or may not contain any actual "CSS" or "Tricks".