Template:ImageCarousel: Difference between revisions

From Imagisphere
Jump to navigation Jump to search
mNo edit summary
mNo edit summary
Line 12: Line 12:
</div></includeonly>
</div></includeonly>
<noinclude>
<noinclude>
{{ImageCarousel|text=Circuit Node|images=[[File:Base_Logic_LCD_Circle_Circuit_Node_Front_Render.png|128px]][[File:Image_Carousel_Dot_On.png|128px]][[File:Image_Carousel_Dot_Off.png|128px]]|customID=carouselCircuitNode1|title=Top Text}}
{{ImageCarousel|images=[[File:Base_Logic_LCD_Circle_Circuit_Node_Right_Render.png|128px]][[File:Base_Logic_LCD_Circle_Circuit_Node_Front_Render.png|128px]][[File:Base_Logic_LCD_Circle_Circuit_Node_Left_Render.png|128px]]|customID=carouselCircuitNode|title=Circuit Node}}
{{ImageCarousel|text=Circuit Node|images=[[File:Base_Logic_LCD_Circle_Circuit_Node_Front_Render.png|128px]][[File:Image_Carousel_Dot_On.png|128px]]|customID=carouselCircuitNode2|title=Bottom Text}}
{{ImageCarousel|images=[[File:Arcade_Direct_Control_Seat_Right_Render.png|128px]][[File:Arcade_Direct_Control_Seat_Front_Render.png|128px]][[File:Arcade_Direct_Control_Seat_Left_Render.png|128px]][[File:Arcade_Direct_Control_Seat_Bottom_Render.png|128px]]|customID=carouselDirectControlPrompt|title=Direct Control Prompt}}


A carousel for images listed in the image field; cycles between images when the arrows are selected.
A carousel for images listed in the image field; cycles between images when the arrows are selected.
Clicking a dot will take you to that item in the list of images.


==Usage==
==Usage==
<pre>
<pre>
{{ImageCarousel|images=[[File:Image_1.png]][[File:Image_2.png]][[File:Image_3.png]]|customID=yourCarousel|title=Top Text}}</pre>
{{ImageCarousel|images=[[File:Image_1.png]][[File:Image_2.png]][[File:Image_3.png]]|customID=yourCarousel|title=Top Text}}</pre>
text - optional name of item displayed


images - list of images
images - list of images

Revision as of 21:45, 9 August 2023


Circuit Node

Tweak Generic Arrow Lesser.svg Tweak Generic Arrow Greater.svg

Direct Control Prompt

Tweak Generic Arrow Lesser.svg Tweak Generic Arrow Greater.svg


A carousel for images listed in the image field; cycles between images when the arrows are selected. Clicking a dot will take you to that item in the list of images.

Usage

{{ImageCarousel|images=[[File:Image_1.png]][[File:Image_2.png]][[File:Image_3.png]]|customID=yourCarousel|title=Top Text}}

images - list of images

customID - if multiple carousels are needed per page, each needs a different id to work

title - text displayed above the carousel