In 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!
I continue to show you how to make a Content Gallery in this tutorial. I’ll focus on how to allow for multiple blocks of content in this tutorial and how to set up arrows to cycle through that content.
This tutorial was ment to originally create a WordPress specific Featured Content, but now it will work on any type of site.
If you missed the previous parts check out WordPress Featured Content and all of the other parts that proceed this one.
In this part of the JQuery Video Tutorial I show you how to create all kinds of cool things using the JQuery UI and plugins.
I’ll show you how to create a really nice JQuery Lightbox using fancybox. It has all the bells and whistles you want.
I’ll then show you how to create a tab interface that is: draggable, resizeable, sortable, and more.
In this part of the JQuery Video Tutorial I will show you how to retrieve information from your server dynamically. It is amazingly easy to implement AJAX concepts using JQuery.
By the end of this tutorial you’ll be able to retrieve plain text and XML. You’ll also be able to access PHP code that can access databases, or any other type of information on your server. And, yes this works dynamically!
In part 6 of my JQuery tutorial I answer many of the questions I’ve received.
I’ll show you how to download the code needed to use JQuery widgets. The JQuery UI website is here.
I then show you how to create Accordions in 2 ways and how to create a image slide show.
In this JQuery video tutorial I introduce the JQuery UI library. I also show you numerous ways to animate elements using JQuery. I cover hide, show, toggle, fadeOut, fadeTo, slideUp, slideDown, animate and effect. I also cover numerous other properties.
If you missed part 1 of this tutorial watch it first JQuery Video Tutorial.
If you want the JQuery UI library, it can be found here JQuery UI Library
I’ve received many requests to cover Document Object Model manipulation with JQuery. So, in this JQuery Video Tutorial I’ll show you numerous ways to add and delete elements to the DOM.
JQuery provides numerous ways to add elements and precise ways to delete others. I’ll specifically cover the following functions: before(), insertBefore(), prependTo(), appendTo(), append(), insertAfter(), after() and remove().
In this JQuery Video Tutorial I will cover numerous topics with a focus on Event Handling. If you missed part 1 check it out first JQuery Video Tutorial.
I’ll show you below how to:
Wow, did the last JQuery Video Tutorial generate a lot of emails! I’m glad you guys and gals are interested in JQuery. Yes I will cover everything there is to know about the JQuery Framework in this tutorial.
If you missed the past tutorial it is here JQuery Video Tutorial.
In this video I’ll answer many of the questions I received such as:
This is the first part of my JQuery Video Tutorial. I will also cover all of the techniques that go into implementing a dynamic site using Asynchronous JavaScript and XML (AJAX).
It is extremely easy to use AJAX techniques with JQuery. First you must understand that AJAX is not a language, it is just a series of techniques used to dynamically change websites with out page reloads.
If you’d prefer to read about AJAX, here is another article Ajax What is it?
In this series of tutorial’s I will show you how to use the amazing JQuery Framework. Not only that, but I’ll show you how to use it to master your Ajax techniques.
If you don’t know, Ajax is an approach to using HTML, JavaScript, DHTML, and the DOM. It allows you to create interactive web applications. When Ajax is implemented with JQuery, you dramatically decrease the complications of implementing AJAX techniques.
Briefly, you will learn:
Here I show you multiple ways you can retrieve text and xml from the server, using JQuery and AJAX technique’s. Of course, this works without a page reload. I’ll also show you how to send data to the PHP server for processing. Like always I’ll walk you through the code and explain everything in blue boxes that lie after the code.
First Here is the XML
Here is the xml code that we will be loading asynchronously onto our web page.
In this article, I’ll show you a bunch of ways to animate text and image’s using JQuery. Like always, I’ll provide snippets of code followed by an explanation on what it does. Let’s start animating.
<html>
<head>
<title>JQuery Example</title>
<script type=”text/javascript” src=”http://code.jquery.com/jquery-latest.js”></script>
Here we start off the HTML code and get the JQuery library for use.
I forgot to cover in depth mouse event handler’s in the last presentation. If you add the following code to my previous JQuery & AJAX tutorial on Event Handler’s, we should be good to go.
You just need to add a little bit of code to implement mouse event handler’s. Change the code where I assign event handler’s to the body to this:
$(‘#theBody’).bind(‘keyup’,checkKeyPressed).bind(‘mousemove’,theMouseMoved);
Here I’ll walk you through a lot of code to explain how you can use Event Handler’s with JQuery and AJAX. To start you off here are all the JQuery Event Handlers and Event Object Properties:
JQuery Event Handler’s
I received email’s stating that I missed some of the way’s you can select elements. I was going to introduce the others as I continued this tutorial. But, you asked for it! So in this article, I’ll give you every other way I know to select element’s with JQuery.
Selecting Element’s with JQuery
You would place the following, inside of the JQuery selection tag’s $(). If some of these don’t make sense I’ll provide further example’s below.
In this article, I’m going to walk you through some code that I styled with JQuery. You’ll learn:
I’ve received many requests for both an AJAX and a JQuery tutorial. So, I’ll cover them both in the same series of articles, because they work well together. I wrote an earlier article on How to AJAX, but I’ll briefly go through what AJAX and JQuery is in this article.
What is AJAX?
There is much confusion concerning Asynchronous JavaScript and XML (AJAX). First off AJAX is not a programming language. It provides a new way for you to use the languages I’ve taught you in previous tutorials:
In the last article, I explained what AJAX is and showed you how to dynamically change the text in DIV’s and SPAN’s without reloading the page. In this article I’ll show you how to place text from your server in DIV’s and SPAN’s, without reloading the page.
All About Events
Most of the time you will bring data onto your web page when an event has been triggered. So I thought it would make sense to list all of the events you can monitor: Continue reading AJAX What is it? How to AJAX Pt. 2
There is much confusion concerning Asynchronous JavaScript and XML (AJAX). First off AJAX is not a programming language. It provides a new way for you to use the languages I’ve taught you in previous tutorials:
AJAX provides you with the ability to: