JavaScript Tutorial

This tutorial tackles on how to create a preview before upload in Angular JS. Preview is useful in application so that the user can check the file before he uploads it. In this tutorial, we're going to preview images using Angular Js. Angular JS is a javascript framework maintained by Google and is capable of creating Single-Page Applications.

This tutorial tackles on how to create a loader using Angular JS. Loaders are usually used in AJAX request before success occurs. You will also learn in this tutorial how to used $timeout of Angular JS which executes a command after a certain amount of time. Angular JS is a javascript framework maintained by Google and is capable of creating Single-Page Applications.

This tutorial will show you how to install ReactJS and on how to set up dependencies for ReactJS. Also, we're gonna be making a "Hello World" app using ReactJS. In order to install the dependencies of ReactJS, we're gonna need to use Node.js.

This is a simple tutorial on how to set up a google map location on your site. We are going to use Google Maps JavaScript API so I'm going to show you how to enable this. And since we're involving location, we're going to use your location's latitude and longitude.

This tutorial will teach you how to preview multiple images before uploading using jQuery. Note: jQuery used in this tutorial is hosted, so, you might need internet connection for it to work.

index.html

This contains our input file that we have customize and our preview area.

This tutorial will teach you on how to customize input file using jQuery and CSS. Note: Scripts and css used in this tutorial are hosted, therefore, you need internet connection for them to work.

Hiding our Input File

First step is to hide our input file.

In this tutorial, I'm going to show you how to add and remove class to a div using jQuery. I've created three buttons each assigned a jQuery function. To start with, be sure to include jQuery on your file in order for the code to work.

Creating our Sample

We create our sample by creating three styles with assigned class each. We name this as "index.php".

In this tutorial, I'm going to show you how to show/hide an area in the page without reloading the whole page using JQuery. I've also included in this tutorial a sample loader and a time out for the loader. Be sure to download the included sample gif and sample jquery.

Creating our Page

We create our page that includes our jquery. To create the page, open your HTML editor and paste the code below.

In this tutorial we will create a Simple Animated Text Using jQuery. The jQuery is a fast, reliable kind of cross-platform javascript library. It is designed to simplify the traditional way of coding in javascript. So let's now do the coding. Creating the Mark Up To display the animated text will need to create the mark up language, to do that open any kind of text editor(notepad++, etc).

In this tutorial we will try to make a very simple game called Snake. Snake is the most popular games in the late 1997 that comes from the Nokia 6110 Phone. This game become a favorite past time for all of us a long time ago, even our grand parents played this awesome game. So for today we will try to replicate the game, but this time we will create it through HTML & jQuery Script. Let's get started.