Unsplashed background img 1
CodeForest - jQuery

jQuery - Beginning

Main Objective

The objective will be to demonstrate basic knowledge of jQuery.

Sub Objective

We will be going over the following in this tutorial:
  • How to link the jQuery library properly
  • Learn about jQuery syntax
  • Code your own document ready event

Prerequisites

You will need to know some basic jQuery methods for this course.

jQuery Library

You have a couple options when it comes to the library.
  • - Download the library from jQuery.com
  • - Add the latest fright from google
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    (this would go in your header or footer, it pulls the scripts right from the web.)

jQuery Syntax

jQuery syntax are the key characters that allows the scripts to perform the various actions it does.
  • - The (selector) is used to target a specific HTML element
  • - The "$" is used to define something and start up jQuery for your scripts
  • - The action() tells the targeted HTML element what to do with itself

Document Ready Event

Some on-load jQuery events have the chance of occuring before the site has fully loaded so you could miss something, thats why it's good to start with a document ready statement.
A document ready funtion would be typed like so:
$(document).ready(function(){ });

This is a simple document ready statement in action, This should help you start determining the use of basic syntax.

See the Pen Slide Toggle Ex. by Alex Coy (@CoyFish) on CodePen.