Template:ImageCarousel: Difference between revisions

From Imagisphere
Jump to navigation Jump to search
mNo edit summary
mNo edit summary
Line 1: Line 1:
<includeonly><div class="imagecarousel">
<includeonly><div class="imagecarousel" style="margin-top:-50px">
{|style="height:10px; text-align:center;"
{|
|<span>[[File:Tweak_Generic_Arrow_Lesser.svg|32px]]</span><span id="{{{customID|image}}}">{{{images|[[File:Base_Logic_LCD_Circle_Circuit_Node_Front_Render.png|128px]]}}}</span><span>[[File:Tweak_Generic_Arrow_Greater.svg|32px]]</span>
|<span>[[File:Tweak_Generic_Arrow_Lesser.svg|32px]]</span><span id="{{{customID|image}}}" style="display:none;">{{{images|[[File:Base_Logic_LCD_Circle_Circuit_Node_Front_Render.png|128px]]}}}</span><span id="carouselScript" data-id="{{{customID|image}}}">[[File:Base_Logic_LCD_Circle_Circuit_Node_Front_Render.png|128px]]</span><span>[[File:Tweak_Generic_Arrow_Greater.svg|32px]]</span>
|-style="height:10px; text-align:center; font-style: italic;"
!Front
|-style="text-align:center;"
|-style="text-align:center;"
|<span>[[File:Image_Carousel_Dot_Off.png|32px]][[File:Image_Carousel_Dot_On.png|32px]][[File:Image_Carousel_Dot_Off.png|32px]]</span>
|<span>[[File:Image_Carousel_Dot_Off.png|32px]][[File:Image_Carousel_Dot_On.png|32px]][[File:Image_Carousel_Dot_Off.png|32px]]</span>
Line 9: Line 7:
<noinclude>
<noinclude>
{{ImageCarousel|text=Circuit Node|images=[[File:Base_Logic_LCD_Circle_Circuit_Node_Front_Render.png|128px]]|customID=carouselCircuitNode1}}
{{ImageCarousel|text=Circuit Node|images=[[File:Base_Logic_LCD_Circle_Circuit_Node_Front_Render.png|128px]]|customID=carouselCircuitNode1}}
{{ImageCarousel|text=Circuit Node|images=[[File:Base_Logic_LCD_Circle_Circuit_Node_Front_Render.png|128px]]|customID=carouselCircuitNode2}}


A carousel for images listed in the image field; cycles when the arrows are selected.
A carousel for images listed in the image field; cycles between images when the arrows are selected.


==Usage==
==Usage==

Revision as of 18:54, 8 August 2023


Tweak Generic Arrow Lesser.svgBase Logic LCD Circle Circuit Node Front Render.pngTweak Generic Arrow Greater.svg
Image Carousel Dot Off.pngImage Carousel Dot On.pngImage Carousel Dot Off.png
Tweak Generic Arrow Lesser.svgBase Logic LCD Circle Circuit Node Front Render.pngTweak Generic Arrow Greater.svg
Image Carousel Dot Off.pngImage Carousel Dot On.pngImage Carousel Dot Off.png


A carousel for images listed in the image field; cycles between images when the arrows are selected.

Usage

{{ImageCarousel|images=[[File:Image_1.png]][[File:Image_2.png]][[File:Image_3.png]]|customID=yourCycle}}

text - optional name of item displayed images - list of images customID - if multiple cycles are needed per page, each needs a different id to work