Currently Browsing: JavaScript Tutorials

Sometimes when working on a client’s site, you might be tasked with trying to capture all out bound links as what we call “external links” and display a confirm message to the user before letting them leave the site. Sounds simple enough right? Well, in a perfect world yes it should be, but more times than not you will be dealing with a whole host of ways page links have been authored....

So today I wanted to spotlight a neat JS library I found while doing some client work called Markup JS by Adam Mark: https://github.com/adammark/Markup.js/ What is Markup JS? Well to answer that question, it might be better to bring in a real world need first. Lets say we are building a web application, or even a really simple web service between frontend and backend using XHR (ajax) only. The first thing...

This is a nice little snip I created when in a bunch with a client who needed a DOM part to be higher up in the source order at particular break points, but not higher up in the source order under other responsive break points. So, if in a bunch, if you can’t convince another developer or owner that the stacking rules would be a better approach, or if you just have no other choice. You can use this...

Today, we will talk about the re-size and mouse move events. These two events indeed are very helpful, but can also be very costly on your site or web app. Let’s take a look at an example of re-size for say window: Vanilla JS versionwindow.addEventListener('resize', function(){ ... logic .... });jQuery version$(window).on('resize', function(){ ... logic ... });Standard...

Today we are going to cover how to extract the polygonal data from Google Earth’s country borders and encode the data into a JavaScript array that we can use in Google maps. With the combination of both polygon borders and Google style wizard you can get some stunning map results. [View Working Example Here] To begin, download and install Google earth here. Once you have installed Google earth, open...

Quick review of jQuery loops and traditional JavaScript loops and how to speed you looping up for both for and while JavaScript looping methods.

Today I would like to talk a bit about setting up events on DOM using jQuery and how one should try to avoid setting up huge numbers of unnecessary events on a single document.

I was recently tasked with replicating a "mousemove()" event on the iPad using the "touchmove()" event. I ran into a few snags and felt it was worthy enough to document my findings. Here I will show you how to properly setup a touchmove() event and even find the touch's page coordinates.

There has been a few times while writing a few jQuery plugins that I come across conditions that almost does the same thing in both the if and else. I always wondered if their was a way to condense such a condition and help lower my file size, and after a little bit of tweaking I figured it out.

Learn how to use both JavaScript Ajax and PHP GD (graphical library) to perform real-time image typesetting onto a image. We will also cover how to use custom text colors, sizes, rotation and even fonts in our example demo.

I find myself now and then on Google trying to hunt down jQuery and jQuery-UI repository links. Over time, I only felt it was necessary to compile everything into one place for other developers to quickly reference and gather their needed jQuery parts.

I was recently given the opportunity to read over the new book "jQuery Plugin Development Beginners Guide" by Giulio Bai, and I must admit this is a must have guide!