Customizing jQuery innerfade plug-in – Adding controls, navigation and caption

First of all thanks goes to Medienfreunde Hofmann & Baldes GbR for their nice jQuery innerfade plug-in. It’s very popular and easy to use plug-in for adding slider in a web application.I’ve been a fan of this nice plug-in. Recently, for an application I had to add some more feature with this plugin. Here, I just want to share my modifications with you.

New features I have added

• • Add Slider controler where you can do play/stop,next/prev,first/last.
  • Add a navigation from where you can navigate to any slide.
  • Add a Slide caption where you can set caption for a slide.

Here is a live demo here.

Download

Download it from here (). The zip file contains modified innerfade plugin along with an example.

How to use

Nothing new. Use this plugin just as the original innerfade plugin. For additional features, set your options from "config.js". You can modify the "slide.css" as your application UI needs. Thats all.

Plug-in Options

• slide_timer_on :  "yes" or "no". If "yes", then  slide will automatically play.
• slide_ui_parent : The ID of <ul> which contains the slide <li>s of slide. ( "portfolio" in attached example slider).
• slide_ui_text : The id of descrition/caption element. “portfolio-desc” in example. In case, you don’t want to use a caption, leave it "null"
• pause_button_id : The id of pause_button. “pause_button” in example. In case, you don’t want to use a controler, leave it "null"
• slide_nav_id: The id of slide navigation. “slide_nav” in example. In case, you don’t want to use a navigation, leave it "null"

I have described here only new feature related options. All other  jquery innerfade settings will remain as is. Thats all. If you want to know anything more, just drop me a line. I will try my best to answer. enjoy!!!!