Home arrow JavaScript arrow Building a Slide Show with jQuery

Building a Slide Show with jQuery

In this first tutorial in a two-part series, I will explain how to build a basic slide show by using the Ajax module included with the increasingly popular jQuery JavaScript framework. As you'll see, the use of the handy $.ajax() method makes this process very simple.

Author Info:
By: Alejandro Gervasio
Rating: 5 stars5 stars5 stars5 stars5 stars / 7
October 08, 2009
  1. · Building a Slide Show with jQuery
  2. · Start building an Ajax-based slide show
  3. · Fetching images from the web server with Ajax
  4. · Listing the slide show's full source code

print this article

Building a Slide Show with jQuery
(Page 1 of 4 )


In the last few months, a brand new JavaScript framework has become increasingly popular for building client-side applications. I'm talking about jQuery, a library that permits you to develop full-featured JavaScript programs by way of a friendly - yet powerful -- programming interface.

Indeed, jQuery comes packaged with an impressive set of methods that allow you to build a huge variety of applications with minor hassles, ranging from typical data validation routines and DOM manipulation to Ajax-driven programs.

As you can see, there's plenty of room here to experiment with this library's API. In this series of two articles, I'll be explaining how to use its Ajax module to develop a simple slide show, similar to the ones that you've seem previously when surfing the web.

In this particular case, the behavior of the slide show that I plan to build in the next few lines is pretty basic. It will work in the following way: first, I'm going to create some sample images that will be stored on a directory in the web server, and then I'll use the Ajax module of jQuery to display these images in a predefined sequence.

Of course, this Ajax-driven application can be used for purposes other than building a slide show. For instance, you might want to utilize it to display a sequence of commercial banners on your own web site, or other kinds of images. In either case, I'm sure that once you've grasped how to use the Ajax module of the jQuery library, you'll get a bunch of ideas for how to use it!

Now, it's time to start developing this Ajax-based slide show with jQuery. Let's jump in!

blog comments powered by Disqus

- Project Nashorn to Make Java, JavaScript Wor...
- JavaScript Virus Attacks Tumblr Blogs
- Google Releases Stable Dart Version, JavaScr...
- Khan Academy Unveils New JavaScript Learning...
- Accessing Nitro? There`s an App for That
- JQuery 2.0 Leaving Older IE Versions Behind
- Fastest JavaScript Engine Might Surprise You
- Microsoft Adjusting Chakra for IE 10
- Brendan Eich: We Don`t Need Google Native Cl...
- An Overview of JavaScript Statements
- An Overview of JavaScript Operators
- Overview of JavaScript Variables
- More of the Top jQuery Social Plugins
- The Top jQuery Social Plugins
- More of the Top jQuery Slider Plugins

Watch our Tech Videos 
Dev Articles Forums 
 RSS  Articles
 RSS  Forums
 RSS  All Feeds
Write For Us 
Weekly Newsletter
Developer Updates  
Free Website Content 
Contact Us 
Site Map 
Privacy Policy 

Developer Shed Affiliates


© 2003-2019 by Developer Shed. All rights reserved. DS Cluster - Follow our Sitemap
Popular Web Development Topics
All Web Development Tutorials