Template:ImageCycle: Difference between revisions

From Imagisphere
Jump to navigation Jump to search
No edit summary
No edit summary
Line 1: Line 1:
<includeonly>
<includeonly>
<span id="{{{customID|images}}}" style="display: none;">{{{images|[[File:Arcade_DC6A_Circuit_Board_Right_Render.png|128px]][[File:Arcade_DC6A_Circuit_Board_Front_Render.png|128px]][[File:Arcade_DC6A_Circuit_Board_Left_Render.png|128px]][[File:Arcade_DC6A_Circuit_Board_Front_Render.png|128px]]}}}</span><span id="{{{customID|image}}}_cycle" data-speed="{{{speed|1.0}}}"></span><script>
<span id="{{{customID|images}}}" style="display: none;">{{{images|[[File:Arcade_DC6A_Circuit_Board_Right_Render.png|128px]][[File:Arcade_DC6A_Circuit_Board_Front_Render.png|128px]][[File:Arcade_DC6A_Circuit_Board_Left_Render.png|128px]][[File:Arcade_DC6A_Circuit_Board_Front_Render.png|128px]]}}}</span><span id="{{{customID|image}}}_cycle" data-speed="{{{speed|1.0}}}"></span><templatestyles src="Template:MyTemplate/Script.js" data-imagesID="{{{customID|images}}}" data-imageCycleID="{{{customID|image}}}_cycle" /></includeonly>
function imageCycleLoop()
{
        image_cycle.replaceChild(image_list[index].cloneNode(true), image_cycle.childNodes[0]);
       
        index++;
 
        if (index >= image_list.length)
            index = 0;
 
        }
var images = document.getElementById('{{{customID|images}}}');
        var image_cycle = document.getElementById('{{{customID|image}}}_cycle');
        var cycle_speed = image_cycle.getAttribute('data-speed');
 
        var image_list = images.children;
 
        var index = 1;
 
        setInterval(imageCycleLoop, 1000 * cycle_speed); 
        image_cycle.appendChild(image_list[0].cloneNode(true));
</script>
</includeonly>
<noinclude>
<noinclude>


Revision as of 19:46, 2 August 2023



<templatestyles src="Template:MyTemplate/Script.js" data-imagesID="arcadeCircuitBoard" data-imageCycleID="arcadeCircuitBoard_cycle" />


Cycles between images listed in the image field, at the specified speed in seconds.

Usage

{{ImageCycle|images=[[File:Image_1.png]][[File:Image_2.png]][[File:Image_3.png]]|speed=1.5|customID=yourCycle}}
Retrieved from "https://wiki.imagisphere.me/index.php?title=Template:ImageCycle&oldid=7722"