TOLRA Micro Systems Limited Blog
Slide show in MODx
Posted 29-04-2009 at 09:40 PM by Paul
Tags modx, slide show
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
Additional Parameters
¬ext=`1` to remove text from the images.
&withClick=`1` to make the images clickable.
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
¬ext=`1` to remove text from the images.
&withClick=`1` to make the images clickable.
Total Comments 0
Comments
Post a Comment
|
