You are not logged in! If you have not registered yet then click here to join the community!

TOLRA Community Forums


Go Back   TOLRA Community Forums > Blogs > TOLRA Micro Systems Limited Blog

Notices

TOLRA Micro Systems Limited Blog
Rating: 17 votes, 5.00 average.

Slide show in MODx

Submit "Slide show in MODx" to Digg Submit "Slide show in MODx" to del.icio.us Submit "Slide show in MODx" to StumbleUpon Submit "Slide show in MODx" to Google
Posted 29-04-2009 at 09:40 PM by Paul

The following MODx snippet allows you to create image slide shows where the current image fades into the next image in the sequence. The snippet allows for multiple slide shows per page with the possibility of displaying text for each image and having each taking the visitor to a different URL when clicked.

Install
  • Download the attached ZIP file.
  • Create a snippet called rotatingPics and paste the contents of the file snippet.php into it.
  • In the document to show the slide show add [!rotatingPics?id=`pics`!]
  • pics is the name of this slide show and must be unique for each slide show.
  • Add and adjust the following to your sites CSS file, pics in each CSS rule should be replace with the slide show name:
    HTML Code:
    #pics_out { width: 200px; height: 200px; background-repeat: no-repeat; background-position: 50% 50%; display: block; }
    #pics_in { width: 200px; height: 200px; background-repeat: no-repeat; background-position: 50% 50%; display: block; cursor: pointer; }
    #pics_txt { width: 200px; height: 3em; background-color: #ccc; padding: 4px; text-align: left; }
  • Create a XMLfile in the assets/files folder of the same name as your slide show e.g. pics.xml and add as many <pic> blocks as required. example.xml in the ZIP file provides a starting place.

Additional Parameters

&notext=`1` to remove text from the images.

&withClick=`1` to make the images clickable.
Attached Files
File Type: zip imagerotate.zip (3.7 KB, 2359 views)
Posted in Miscellaneous
Views 19066 Comments 0
« Prev     Main     Next »
Total Comments 0

Comments

Post a Comment Post a Comment

All times are GMT +1. The time now is 10:26 PM.