Creating first jQuery slideshow plugin, converting from Javascript

You can use nivo slider .

You just have to mention description of an image in alt attribute and title of an image in title attribute.

And just attach the plugin to your wrapper element:

$(window).load(function() {

A simple way to create such plugin

jQuery.fn.imgSlider = function( options ) {

    // default settings:
    var defaults = {
        textColor: "#000",
        backgroundColor: "#fff",
        fontSize: "16px",
        getTextFromTitle: true,
        getTextFromAlt: false,
        animateOpacity: true,
        animationDuration: 500,
        clickImgToGoToNext: true,
        clickImgToGoToLast: false,
        nextButtonText: "next",
        previousButtonText: "previous",
        nextButtonTextColor: "red",
        previousButtonTextColor: "red"

    var settings = $.extend( {}, defaults, options );

    return this.each(function() {
        // Plugin code would go here...


call the plugin

$( "div" ). imgSlider();

Edit 2

I have created a jQuery Image Slider Plugin.
here is the example with annotated code.

Leave a Comment