|
|
| (4 intermediate revisions by the same user not shown) |
| Line 12: |
Line 12: |
| | This will display: | | This will display: |
| | {{#widget:{{PAGENAME}} | | {{#widget:{{PAGENAME}} |
| − | |img.DSP experiments=blinking_led.jpg | + | |img.DSP experiments={{filepath:blinking_led.jpg}} |
| − | |img.3D printing=3D_printer_Picture.jpg | + | |img.3D printing={{filepath:3D_printer_Picture.jpg}} |
| | }} | | }} |
| | | | |
| Line 39: |
Line 39: |
| | { | | { |
| | "use strict"; | | "use strict"; |
| − | /*
| |
| − | <!--{foreach from=$img key=link item=desc}-->
| |
| − | <!--{$link}-->
| |
| − | {{filepath:<!--{$link}-->}}
| |
| | | | |
| − | <!--{$desc|escape:'html'}--> | + | var images = [ |
| | + | <!--{foreach from=$img key=desc item=link}--> |
| | + | [ "<!--{$link|validate:url}-->", "<!--{$desc|escape:'html'}-->" ], |
| | <!--{/foreach}--> | | <!--{/foreach}--> |
| − | */
| |
| − |
| |
| − | var images = [
| |
| − | [ "/w/images/thumb/e/e0/Blinking_led.jpg/1200px-Blinking_led.jpg", "DSP experiments" ],
| |
| − | [ "/w/images/thumb/4/4f/3D_printer_Picture.jpg/1200px-3D_printer_Picture.jpg", "3D printing" ],
| |
| − | [ "/w/images/thumb/d/d9/L1.jpg/1200px-L1.jpg", "in the news" ],
| |
| − | [ "/w/images/thumb/a/ae/Bzzt_kit.jpeg/1196px-Bzzt_kit.jpeg", "kits for kids" ],
| |
| − | [ "/w/images/b/b4/ACKbot.png", "helping bots" ],
| |
| − | [ "/w/images/thumb/a/a6/Coinvox_22_keypad.jpg/1221px-Coinvox_22_keypad.jpg", "payphone restauration" ],
| |
| − | [ "/w/images/thumb/4/4b/T-DOSE_2014_entrance_hall.jpg/1200px-T-DOSE_2014_entrance_hall.jpg", "conferences" ],
| |
| − | [ "/w/images/2/25/Ledstrip2.jpg", "LEDstrip experiments" ],
| |
| − | [ "/w/images/thumb/3/32/IMG_0255.JPG/1200px-IMG_0255.JPG", "food" ],
| |
| − | [ "/w/images/7/75/Bbq_20140322_nom.jpg", "moar food" ],
| |
| − | [ "/w/images/thumb/1/16/Guerilla_voip_in_use.jpg/1200px-Guerilla_voip_in_use.jpg", "VoIP" ],
| |
| − | [ "/w/images/thumb/1/15/DL360_stack.jpg/1200px-DL360_stack.jpg", "virtual machine experiments" ],
| |
| − | [ "/w/images/a/ab/Open.jpg", "new car features" ],
| |
| − | [ "/w/images/thumb/1/11/Neon_workshop_29-06-2013.jpg/1205px-Neon_workshop_29-06-2013.jpg", "neon workshop" ],
| |
| − | [ "/w/images/thumb/b/b8/Christmastree_2016.jpg/1200px-Christmastree_2016.jpg", "christmas tree pixelflut" ],
| |
| − | [ "/w/images/2/29/Infleshoningwijn.JPG", "food experiments" ],
| |
| − | [ "/w/images/thumb/b/b0/Open_Door_Day_November_26_2.jpg/1200px-Open_Door_Day_November_26_2.jpg", "telephone monitoring" ],
| |
| − | [ "/w/images/a/ae/DigitalControlledMeter.jpg", "microcontroller experiments" ],
| |
| − | [ "/w/images/thumb/b/be/PICT0031.JPG/1200px-PICT0031.JPG", "LED displays" ],
| |
| − | [ "/w/images/b/b5/IMG_0866_wiki.JPG", "lockpicking" ],
| |
| − | [ "/w/images/thumb/1/19/FPGAscreen.jpg/1200px-FPGAscreen.jpg", "gameboy adapter" ]
| |
| | ]; | | ]; |
| − |
| |
| | | | |
| | var container = document.getElementsByClassName("slideshow-container")[0]; | | var container = document.getElementsByClassName("slideshow-container")[0]; |
This widget allows you to display an image carousel on your wiki page.
Created by xopr, inspired by W3schools example
Using this widget
To insert this widget, use the following code:
{{#widget:ImageCarousel
}}
This will display:
Note:
- this is a work in progress
Copy to your site
To use this widget on your site, just install MediaWiki Widgets extension and copy full source code of this page to your wiki as Widget:ImageCarousel article.
