Saturday July 22, 2017
Create Account

The S5 Image Fader v3 brings a nice new list of features to our old image fader module. The new version runs off of mootools and allows you to use an unlimited number of images to rotate through. You simply select a directory on your server to pull images from and the module will pull and display all the images from that directory! You can choose from fade in/out, zoom/pan and slide for the transition effects between images. We still included the legacy option running of S5 Effects if you need to run the older version of this module.



if

Tutorial:


1. First off you'll need to get your images uploaded to a directory on your server. In the admin of the module you'll need to put relative path to your images. For example if you have your images stored here: http://www.myserver.com/images/ then the relative path would just be "images" in the admin of the module.

2. Next is naming your images. The only part that matters for this module is that right before your image extension ( .jpg, .gif, .png) is that you include an "m" for main image. If you are using thumbnails you'll need to include "mt" for main thumbnail.

3. The next thing to note is that your images will be pulled no matter what you include before the "m" and "mt" so you could name them: testm.jpg and testmt.jpg for the first image and checkitm.jpg and checkitmt.jpg for the second image and the fader will pull them. This is ok if you don't need an ordering to your images but if you do then name them as follows:

0_0m.jpg
0_1m.jpg
0_2m.jpg

And so on for the first ten, now the next ten you must prefix with 1 so that all the next ten stay in the number 1 set. The first number depicts the set and the second number is the image in that set, for exmple:

1_0m.jpg
1_1m.jpg
1_2m.jpg



Image Fader Legacy Mode:


This version is powered by S5 Effects. This means you will not receive any conflicts with other javascript libraries your template, modules or components might be using. The image fader will rotate between 10 images. Choose either the fade in effect which fades each picture into the next one, or choose the fade in/fade out effect.
Fade in Mode:

  • 100% powered by S5 Effects (no script conflictions)
  • Specify height and width of images
  • Up to 10 images able to rotate at one time
  • Set background color
  • Set how fast the image fades (tween time)
  • Set how long the image displays before fading
  • Includes slide selector buttons



Fade in/Fade out Mode:

  • 100% powered by S5 Effects (no script conflictions)
  • Specify height and width of images
  • Up to 10 images able to rotate at one time
  • Set background color
  • Set how fast the image fades (tween time)
  • Set how long the image displays before fading
  • Enable or disable Mootools image reflections
  • Each image slide can have its own hyperlink

The S5 Tab show module has been edited to match the layout of this design. This module can be demoed on the homepage of this design.

It holds up to 10 actual module positions so you can publish any of your favorite modules to one of the slides and keep your site clean and consolidated while giving it some eye candy. So simply add the modules positions as described below, publish the s5 tab show module and then start publishing modules to the positions in the tab show (s5_tab1, s5_tab2, etc)

The following is a quick list of features that are included with the module:

  • Choose Mootools slide in or S5 Effects snap in or fade in effects (Choose S5 Effects to guarantee no script conflictions)
  • Set button backgrounds and hovers
  • Holds up to 10 module positions
  • Specify the width of the module
  • XHTML Valid

Joomla 1.5 new module positions setup. Here's how you do it:

  • Open up the XML file included with the template you are using
  • Locate the <positions> area
  • Start adding new positions <position>s5_tab1</position> <position>s5_tab2</position>, etc all the way up to s5_tab10.
  • Click the save button in the upper right hand corner and you're done!


I like what I see! I want to JOIN TODAY

Visit Our Sponsor

S5 Box

Login to Downtown.LA

Registered users can publish images, videos, articles, comments and more. You also get your own blog page to keep track of what you publish.

Create Account

Click "CREATE AN ACCOUNT" below. It's free! Registered users can publish images, videos, articles, comments and more. You also get your own blog page to keep track of what you publish.