New Feature: Playlist Center! Pick a topic and let our playlists guide the way.

Easy-to-follow video tutorials help you learn software, creative, and business skills.Become a member

Downloading and installing jQuery

From: jQuery Essential Training

Video: Downloading and installing jQuery

Okay, let's begin by taking a look at how we download and install jQuery onto our computer so we can use it. So, here I am on the jquery.com website, and I am going to go over here to the big Download jQuery button and click on it. Now, there are two different versions of jQuery. There is the compressed production version, and then there is the uncompressed development version. Essentially what you do is you usually download both of these and you use the Development version while you're doing your development, and then when you're ready to upload your finished project to your web server, you use compressed production version.

Downloading and installing jQuery

Okay, let's begin by taking a look at how we download and install jQuery onto our computer so we can use it. So, here I am on the jquery.com website, and I am going to go over here to the big Download jQuery button and click on it. Now, there are two different versions of jQuery. There is the compressed production version, and then there is the uncompressed development version. Essentially what you do is you usually download both of these and you use the Development version while you're doing your development, and then when you're ready to upload your finished project to your web server, you use compressed production version.

And the reason you do that is because the compressed, production version is minified and compressed, and it's a lot faster to download to your user's computer than the uncompressed development version. The uncompressed development version is also a lot more readable, so if you're debugging, you can step through the code a lot easier. So, essentially what you do is you click on the link for the one you want to download. So for example, to download the compressed production one, I'll just simply click on this link. Now what might happen when you do this, is you might get a screen full of code like this depending on the browser that you are using, and the reason for this is because the browser doesn't recognize the .js file as something that needs to be downloaded.

So, what we need to do in this case is let's just go back. In this case, what I am going to do is I am going to right-click on this link right here. I am going to choose Save as, and then I am going to save it as a JavaScript file, where I want to put the result. And in this case, I am going to put it into the Exercise Files folder for the course. You can see I have already got the uncompressed development version, and I am going to go ahead and save the minified version, which has this .min extension on it, and so I'll choose Save and it comes down.

So, same thing for other browsers. Let's go ahead over to Firefox to see the same thing. Okay, so here we are in Firefox. I am going to click Download, and I am going to click on production. You can see the same thing happened here. What happened was Firefox doesn't recognize the .js as something to download. So again, same story. Just simply right-click or if you're on a Mac you can Ctrl+Click and you get the same experience. All right! So now that we have got jQuery downloaded, we can move on and start coding.

Show transcript

This video is part of

Image for jQuery Essential Training
jQuery Essential Training

49 video lessons · 93782 viewers

Joe Marini
Author

 
Expand all | Collapse all
  1. 2m 52s
    1. Welcome
      1m 9s
    2. Using the exercise files
      1m 43s
  2. 17m 37s
    1. What is jQuery?
      5m 19s
    2. Downloading and installing jQuery
      2m 20s
    3. Creating a simple jQuery-enabled page
      7m 12s
    4. Overview of features in jQuery
      2m 46s
  3. 59m 57s
    1. Overview of selectors and filters
      2m 9s
    2. Using basic jQuery selectors
      9m 6s
    3. Using basic jQuery filters
      8m 35s
    4. Using jQuery attribute filters
      6m 7s
    5. Child, visibility, and content filters
      9m 59s
    6. Form selectors and filters
      9m 3s
    7. Traversing documents
      9m 1s
    8. Understanding jQuery statement chaining
      1m 42s
    9. Practical example 1: Annotating page links
      4m 15s
  4. 47m 16s
    1. Creating, getting, and setting content
      5m 53s
    2. Manipulating attributes
      5m 43s
    3. Inserting content
      4m 57s
    4. Wrapping, replacing, and removing content
      5m 27s
    5. Working with CSS
      6m 19s
    6. Associating data with page elements
      9m 30s
    7. Practical example 2: Automatic TOC generator
      9m 27s
  5. 33m 6s
    1. Understanding the jQuery event handling features
      2m 4s
    2. Binding and unbinding events
      6m 23s
    3. Convenient event helper methods
      4m 40s
    4. Using the jQuery event object
      6m 21s
    5. Using miscellaneous event features
      4m 38s
    6. Practical example 3: Table striping and highlighting
      9m 0s
  6. 28m 45s
    1. Hiding and showing elements
      5m 23s
    2. Fading elements in and out
      4m 2s
    3. Sliding elements
      4m 3s
    4. Creating custom animations
      5m 58s
    5. Practical example 4: Image rotator
      9m 19s
  7. 25m 30s
    1. Introduction to jQuery UI
      3m 40s
    2. Exploring the jQuery UI widgets
      5m 24s
    3. Exploring the jQuery UI effects
      3m 58s
    4. Using the jQuery UI ThemeRoller
      4m 11s
    5. Downloading and installing jQuery UI
      8m 17s
  8. 47m 49s
    1. Overview of the sample web site
      3m 50s
    2. Using the accordion widget
      9m 14s
    3. Creating an image rotator
      10m 22s
    4. Building hover tooltips
      7m 26s
    5. Making an image selector
      9m 30s
    6. Using the Resizable effect
      7m 27s
  9. 30m 2s
    1. Working with Asynchronous JavaScript and XML (AJAX)
      10m 8s
    2. Using AJAX helpers
      4m 34s
    3. Understanding AJAX data types
      10m 14s
    4. Using global AJAX event handlers
      5m 6s
  10. 20s
    1. Goodbye
      20s

Start learning today

Get unlimited access to all courses for just $25/month.

Become a member
Sometimes @lynda teaches me how to use a program and sometimes Lynda.com changes my life forever. @JosefShutter
@lynda lynda.com is an absolute life saver when it comes to learning todays software. Definitely recommend it! #higherlearning @Michael_Caraway
@lynda The best thing online! Your database of courses is great! To the mark and very helpful. Thanks! @ru22more
Got to create something yesterday I never thought I could do. #thanks @lynda @Ngventurella
I really do love @lynda as a learning platform. Never stop learning and developing, it’s probably our greatest gift as a species! @soundslikedavid
@lynda just subscribed to lynda.com all I can say its brilliant join now trust me @ButchSamurai
@lynda is an awesome resource. The membership is priceless if you take advantage of it. @diabetic_techie
One of the best decision I made this year. Buy a 1yr subscription to @lynda @cybercaptive
guys lynda.com (@lynda) is the best. So far I’ve learned Java, principles of OO programming, and now learning about MS project @lucasmitchell
Signed back up to @lynda dot com. I’ve missed it!! Proper geeking out right now! #timetolearn #geek @JayGodbold

Are you sure you want to delete this note?

No

Thanks for signing up.

We’ll send you a confirmation email shortly.


Sign up and receive emails about lynda.com and our online training library:

Here’s our privacy policy with more details about how we handle your information.

Keep up with news, tips, and latest courses with emails from lynda.com.

Sign up and receive emails about lynda.com and our online training library:

Here’s our privacy policy with more details about how we handle your information.

   
submit Lightbox submit clicked
Terms and conditions of use

We've updated our terms and conditions (now called terms of service).Go
Review and accept our updated terms of service.