If you haven’t been following our series and do not have a good understanding of both HTML and CSS then now would be a good opportunity to take a look at our existing tutorials covering both of these.
To download jQuery, head to the Google repository and download the latest version. You can embed the jQuery library right into your HTML Head tag and once linked, you are ready to utilize jQuery’s powerful functions. You can create a new jQuery file with the extension .js to store your functions and link it to your HTML page. In the next part of the tutorial we will be looking at coding our first jQuery function. But for now, lets set up the necessary links to utilize jQuery in our website.
Once you have download your jQuery files from the Google Repository, create a new folder in your website root directory (where you see your index.html file) and save your jQuery download in there. Then use the following line of code to link your HTML to your jQuery:
Then go ahead and create a new file in the same folder called ‘js.js’ – this file will store all of your custom jQuery code. Once created, link it to your HTML with the following:
Thats it! You’re ready to experience the potential of jQuery. Stay tuned for the next tutorial where we will be continuing our series by designing a navigation menu with animations using jQuery!