Home arrow JavaScript arrow Building a Slide Show with jQuery
JAVASCRIPT

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: 4 stars4 stars4 stars4 stars4 stars / 4
October 08, 2009
TABLE OF CONTENTS:
  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
SEARCH DEVARTICLES

TOOLS YOU CAN USE

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

Introduction

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
JAVASCRIPT ARTICLES

- More Top jQuery Plugins for Menus
- Top jQuery Tutorials for Beginners
- New UI Framework and SDK for JavaScript Rele...
- JavaScript OpenPGP Tool, Node.js 0.6.3 Avail...
- Yahoo Releases Cocktails Language and Develo...
- Customizing jQuery Slideshows: Dynamic Contr...
- Customizing jQuery Slideshows: the animate()...
- Customizing jQuery Slideshows: slideUp() and...
- Customizing jQuery Slideshows: hide() and sh...
- Web Workers: Performing Calculations in Para...
- More Top JavaScript Frameworks and Libraries
- More Dynamic jQuery Styling Techniques
- The Top JavaScript Libraries
- The Top JavaScript Frameworks
- Dynamic jQuery Styling

Dev Articles Forums 
 RSS  Articles
 RSS  Forums
 RSS  All Feeds
Weekly Newsletter
 
Developer Updates  
Free Website Content 
Contact Us 
Site Map 
Privacy Policy 
Support 



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