Extension:JavascriptSlideshow

MediaWiki extensions manual

JavascriptSlideshow Release status: unmaintained
Implementation	Tag , Parser function
Description	Create a slideshow (using JavaScript) from multiple included div elements
Author(s)	Chris Reigrut, Yaron Koren, DaSch, Alexia E. Smith, Nick White
Latest version	2.0.0 (2019-02-19)
MediaWiki	1.29+
PHP	5.6+
Database changes	No
License	GNU General Public License 3.0 or later
Download	GitLab: project page git repository URL [help ] commit history Note: No localisation updates are provided by translatewiki.net .
Example	wiki.comakingspace.de
Tags ‎<slideshow>
Hooks used ParserFirstCallInit

The JavaScriptSlideshow extension creates a slideshow which can:

• Create a "rotating" slideshow (i.e. one that changes from one picture to another)
• Create stop-action animation from multiple images or multiple pieces of text

Installation

• Download, extract and place the file(s) in a directory called JavascriptSlideshow in your extensions/ folder.
• Add the following code at the bottom of your LocalSettings.php file:

  wfLoadExtension( 'JavascriptSlideshow' );
  

  $wgHtml5= true; // when using MW 1.33 or earlier
  

•  Done – Navigate to Special:Version on your wiki to verify that the extension is successfully installed.

To users running MediaWiki 1.32 or earlier:

The instructions above describe the new way of installing this extension using wfLoadExtension(). If you need to install this extension on these earlier versions (MediaWiki 1.32 and earlier), instead of wfLoadExtension( 'JavascriptSlideshow' );, you need to use:

require_once "$IP/extensions/JavascriptSlideshow/JavascriptSlideshow.php";

Options / attributes

id

The id to be given to the div containing the content. This allows you to pre-specify the id for styling purposes. If none is specified, the id will be a randomly generated number starting with 'slideshow_' (e.g. slideshow_12345).

refresh

The time, in milliseconds, between transitions. The default is 1000 milliseconds (one second).

sequence

The sequence in which to display the content. Must be one of the following values:

• forward: This is the default.
• backward
• random

transition

How to transition (change) between content. Must be one of the following values:

• cut: A straight cut from the current content to the new content. This is the default.
• fade: A one-second fade between the current content and the new content.
• blindDown: The new content "rolls down" over the existing content.

transitiontime

The time, in milliseconds, that transitions take to complete. The default is 400 milliseconds. Increase it to make transitions slower.

center

if 'true', center the slideshow (only works for a slideshow of images, not text).

Examples

Tag

<slideshow sequence="random" transition="fade" refresh="10000">
<div>[[Image:Image1.jpg|thumb|right|128px|Caption 1]]</div>
<div>[[Image:Image2.jpg|thumb|right|128px|Caption 2]]</div>
<div>[[Image:Image3.jpg|thumb|right|128px|Caption 3]]</div>
</slideshow>

This results in a div (with a randomly generated id) that randomly changed every 10 seconds between the three images specified (which happen to be wiki images).

Parser function

{{#slideshow:
<div>Tick</div><div>Tock</div>
|id=bar refresh=1000
}}

would result in a div (with an id of bar) that changed every second between the words Tick and Tock.

See also

• Simple CSS slideshow