Category Archives: Javascript Scripting Tutorial

Learn JavaScript in One Video

JavaScript TutorialIn this video I did my best to create the most comprehensive JavaScript tutorial I could all in one video. I cover all of the following topics : Variables, Math, Random Numbers, Strings, Styling Strings, If, Switch, Ternary Operator, While, Do While, For, For In, Arrays, Functions, Pass Function as Parameter, Receive Variable Number of Arguments, Return Variable Number of Arguments, Recursive Functions, Event Handling, Mouse Events, Key Events, Change Tag Value, Change Class, Change Input Element, Mouse X / Y Coordinates, Element Styling, Manipulating URLs, Get Elements by Tag Name, Editing Child Nodes, Setting Attributes, Adding Elements, OO JavaScript, Form Validation, Exception Handling and much more. Continue reading Learn JavaScript in One Video

Make an Image Gallery with JQuery Pt 2

Make an image galleryIn my previous tutorial How to Make a Slideshow, I showed you all of the HTML and CSS code that is required to make an image gallery with JQuery.

In this video tutorial, I’ll go over all of the JQuery and JavaScript needed to finish this image gallery tutorial.

This also is going to be a pretty awesome JQuery tutorial, because I’m going to review a lot!

Continue reading Make an Image Gallery with JQuery Pt 2

How to Make a Slideshow

JQuery SlideshowCharlie wrote and asked for me to make a slideshow or gallery from scratch. So, today I will show you how to make a slide show.

All of the HTML, CSS, JavaScript and JQuery code required will be provided and explained. Here is the code in a zipped archive JQuery Slideshow Code.

First, I’ll go over all of the HTML and CSS. Then in the next part of the tutorial I’ll cover all of the JavaScript and JQuery required.

Continue reading How to Make a Slideshow

JavaScript Video Tutorial Pt 9

JavaScript CookiesIn this JavaScript Video Tutorial, I show you how to create, change, delete and retrieve the values in JavaScript cookies.

I also review some useful string functions and other ways to use the Document Object Model.

If you missed previous versions of this video tutorial, it all started with this JavaScript Video Tutorial Part 1. By the end of this tutorial you’ll not only understand how to do anything with cookies, you’ll also have an intimate knowledge of the DOM.

Continue reading JavaScript Video Tutorial Pt 9

JavaScript Video Tutorial Pt 8

Javascript Error HandlingIn this tutorial I go over a bunch of JavaScript tricks with a focus on error handling in general. If you missed the other parts of this tutorial you should start here JavaScript Video Tutorial.

I’m going to touch on how to dynamically update the web page, because you guys have some questions about that. I’ll then explain how JavaScript Error Handling works by showing you how Try, Throw and Catch works.

All of the code follows the video below and it is free to use however you’d like.

Continue reading JavaScript Video Tutorial Pt 8

JavaScript Video Tutorial Pt 7

JavaScript Form ValidationIn this part of my JavaScript Video Tutorial, I explain how to dynamically validate forms using JavaScript. This is also a review on how to use the Document Object Model and Regular Expressions.

If you missed the first part of this tutorial, it is available here JavaScript Video Tutorial.

I specifically cover how to:

Continue reading JavaScript Video Tutorial Pt 7

JavaScript Video Tutorial Pt 6

Regex TutorialIn this part of the JavaScript Video tutorial I will introduce Regular Expressions. A large number of people have trouble with Regular Expressions. I think it is because the name is so confusing? They aren’t!

A Regular Expression is a series of codes used to describe a series of characters in a string.

They are used to search for a specific string of characters in another string.

Continue reading JavaScript Video Tutorial Pt 6

JavaScript Video Tutorial Pt 5

I have received many questions about how to manipulate the Document Object Model (DOM) with JavaScript. In this tutorial I will focus on the many ways to do just that.

I’ll show you how to easily dramatically change your web pages the easy way using getElementById. I’ll then show you how to:

  • Add Elements to a Web Page Dynamically
  • Remove Elements
  • Edit Child Elements

Continue reading JavaScript Video Tutorial Pt 5

JavaScript Video Tutorial Pt 4

Javascript Video TutorialIn this JavaScript video tutorial I spend some time explaining the complexity of using Arrays and Functions in JavaScript. If you missed part 1, watch that first JavaScript Video Tutorial.

JavaScript Arrays are different from many languages because you can pretty much throw anything in them. This is because JavaScript isn’t strongly typed once again.

JavaScript Functions are also odd because they don’t follow the normal scoping rules used in most other languages. And, did you know you can completely disregard the number of arguments a function will accept? You’ll learn this plus how to:

Continue reading JavaScript Video Tutorial Pt 4

JavaScript Video Tutorial Pt 3

JavaScript OOPIn this JavaScript Video Tutorial I will completely cover JavaScript Object Oriented Programming. If you haven’t watch part 1 of this tutorial first JavaScript Video Tutorial.

OOP in JavaScript works differently from other languages. Because JavaScript is loosely typed (datatypes don’t have to be explicitly stated) you are unable to implement certain OOP concepts in JavaScript. You can however take advantage of many of the positives obtained through the use of OOP using JavaScript.

Continue reading JavaScript Video Tutorial Pt 3

JavaScript Video Tutorial Pt 2

JavaScript EventsIn this video tutorial I cover numerous techniques that can be implemented by monitoring events. If you missed part 1 watch it first JavaScript Video Tutorial.

This video is both a review of what you were taught in part 1, but also you’ll learn:

  • Every Single Event in JavaScript
  • How to Create Inline JavaScript
  • How to Change CSS Styling on Anything Dynamically
  • Change Elements or Delete them Completely
  • Monitor Every Mouse Movement and Key Press Dynamically

And, numerous other things. All of the code follows the video. If you have any questions or comments, leave them below.

Code From the Video

JavaScript Video Tutorial

Learn JavaScriptIn this JavaScript Video Tutorial I’ll teach you all of the core knowledge needed to write JavaScript code in 30 minutes. I’ve never seen a tutorial like this and was interested in whether you all would like to see more tutorials like this?

I specifically cover the following topics:

  • JavaScript Datatypes
  • Embedding JavaScript
  • Linking to JavaScript
  • Conditional Statements
  • Looping
  • Arrays
  • Strings
  • Functions

And, a great deal more along the way. If you’d like to read this information in a slower for see JavaScript Scripting. I also created another JavaScript tutorial that also proceeds at a slower pace if you’d like to check that out Learn JavaScript.

All of the code used follows the video. Leave any questions or comments below 🙂

[adsense]

Code From the Video

JQuery & AJAX Selecting & Editing Elements

In this article, I’m going to walk you through some code that I styled with JQuery. You’ll learn:

  • How to select elements in your web page numerous ways
  • How to edit elements in your web page in numerous ways
  • Learn how to monitor event handler’s with JQuery and JavaScript
  • And a bunch more…

Continue reading JQuery & AJAX Selecting & Editing Elements

JavaScript Frameworks

If you have been programming in JavaScript, you have heard about all the frameworks available. The most popular frameworks are:

  • Prototype
  • JQuery
  • MooTools
  • Scriptaculous

I’ve been pondering whether I was going to cover frameworks on my site because while I have used them, I prefer to write and reuse my own code. So, in this article I’m going to go through the pro’s and con’s of using frameworks. Continue reading JavaScript Frameworks

Javascript Video Scripting Tutorials

Here are all of my Javascript Video Scripting Tutorials and Javascript articles. I hope you find it to be useful.

Index to Articles on Javascript:

Continue reading Javascript Video Scripting Tutorials

Javascript Scripting Tutorial: Built in Functions

In this article, I’ll list all of the built in functions available to you with Javascript. While not everything will be covered, I will cover every function that is used on a regular basis. I’m still deciding whether I’ll cover Javascript Graphics or AJAX next. Leave comments below to help me understand. On to the functions.

Javascript Array Functions

In previous articles I described how to create Arrays, but if you forgot here is how you create arrays:

  • var a = new array() // Creates an empty array
  • var b = new array(8) // Creates an array with 8 element cells
  • var c = [1, 2, “turtle”, “number”, true]; // Creates an array with a bunch of random values

Javascript Array Properties and Functions

  • b.length // A property that would return the value of 8, because of the array declaration above
  • c.concat(3,4) // The array c now has the values 1, 2,  “turtle”, “number”, true, 3, 4
  • c.join(“: “) // Returns a string with each element separated by a colon and a space. 1: 2: number: true
  • c.slice(0, 2) // Returns an array which contains all elements between the first value you pass to the second value. In this example you would be returned [1, 2, number]
  • c.sort() // Returns the array elements in alphabetical order. This example returns [1, 2, number, true, turtle]
  • c.toString() // Converts the array into a string and then returns the string.

Continue reading Javascript Scripting Tutorial: Built in Functions

Javascript Scripting Tutorial Pt 5

Error Handling in Javascript

I’ve covered most everything you need to know to program in Javascript except for Error Handling. So, in this article I’ll explain how to handle those nasty errors when they crop up.

An exception is thrown whenever an error occurs in your code. You can set up your code in a way, so that it throws exceptions that you have a pre-built solution for. Let us say one of your functions divides numbers. We all know that dividing into zero produces a result of infinite. So, it would be a good idea to head off a zero division. How would you do that?

You would write some code that throws the exception or error and then catch and respond to such an error. The throw statement follows this style: throw expression;

Normally, the value of the expression is a string that represents what error caused an exception to be thrown. Ex. throw new error(“A division by zero occured”); Continue reading Javascript Scripting Tutorial Pt 5

Javascript Scripting Tutorial Pt 4

In the previous tutorials we covered just about everything there is to know about Javascript. If you missed those, the first article in the Javascript Scripting Tutorial can be found here.

In this article we will cover Cookies. Just so you know what to look forward to, we will finish off the whole tutorial by learning how to create an interactive menu and handle errors. Then you’ll be a Javascript expert.

Cookies

With cookies it is possible to store information on a visitors computer so you will recognize them when they return in the future. A cookie is simply a tiny text file (4k) that is stored on a client’s computer. You can only store a total of 20 cookies per computer. You define how long they will stay on that computer, but the visitor can force them to be deleted at any time. Continue reading Javascript Scripting Tutorial Pt 4

Javascript Scripting Tutorial Part 3

Javascript Tutorial Regular Expressions, Form Validation and Event Handlers

Today I’m going to continue teaching you everything about Javascript. If you haven’t read my other Javascript tutorials they are available here:

You must read these tutorials before you have any hope of understanding the code that is coming. Like in the last tutorial I will teach you Javascript by walking you through a working script. As the title says above, this tutorial will focus on Regular Expressions, Form Validation and Event Handlers.

Regular Expressions

A Regular Expression is used to describe a series of characters, numbers and symbols. Regular expressions are used to verify that a visitor to your site entered a correct phone number or address. You would use a Regular Expression to state that the phone number:

Free Javascript Scripting Tutorial Part2

In this article I’ll explain Javascript Scripting. If you haven’t read my previous article on Javascript Scripting you should read it first. It provides a brief overview on the capabilities of Javascript. Here is the location of the code you’ll be working with, to see what you’ll learn. Here I’ll run you through some Javascript code and explain the following:

Continue reading Free Javascript Scripting Tutorial Part2