Widget:SlidingGallerySewing

<style> /* Layout containers matching your original specifications */ .gallery-outer { position: relative; height: 100%; margin: 20px 0; } .gallery-bg { position: relative; margin: 0 -1em; padding: 0; background-color: transparent; border: 1px none #ddd; height: 100%; } .gallery-viewport { position: relative; margin: 0 auto; width: 742px; height: 300px; overflow: hidden; }

/* Sliding engine (Pure CSS - Starts automatically) */ .wrapper {

 position: absolute;
 top: 0;
 left: 0;
 display: flex;
 gap: 20px;
 width: 3000px; /* Generous width for the moving track */
 animation: 45s credits linear infinite;

}

/* ⏸️ PAUSE ANIMATION ON HOVER */ .wrapper:hover {

 animation-play-state: paused;

}

.gallery-item {

 display: inline-block;
 text-align: center;
 width: 160px;
 flex-shrink: 0;

}

.gallery-item img {

 width: 120px;  
 height: 180px; 
 object-fit: contain;
 transition: transform 0.3s ease;

}

/* 🔍 ENLARGE IMAGE ON HOVER */ .gallery-item img:hover {

 transform: scale(1.15);
 cursor: pointer;

}

.gallery-caption {

 font-size: 0.85em;
 color: #333;
 margin-top: 8px;
 line-height: 1.3;

}

@keyframes credits {

 0% { transform: translateX(0); }
 100% { transform: translateX(-1620px); } /* Perfect loop reset point based on total item widths */

} </style>

         <a href="/wiki/Singer_HD_4432">
           <img src="/wiki/images/thumb/e/e1/Singer_HD-1_4452.jpg/600px-Singer_HD-1_4452.jpg?20250616215327" alt="Singer HD 4432">
         </a>

Singer HD 4432
Basic sewing machine

         <a href="/wiki/Singer_Simple_3232">
           <img src="/wiki/images/thumb/0/08/Singer_Simple.jpg/800px-Singer_Simple.jpg?20191223184102" alt="Singer Simple 3232">
         </a>

Singer Simple 3232
Starter sewing machine

         <a href="/wiki/Janome_HD-3000BE">
           <img src="wiki/images/thumb/0/01/Janome_HD-3000BE.jpeg/400px-Janome_HD-3000BE.jpeg" alt="Janome HD-3000BE">
         </a>

Janome HD-3000BE
Presser foot attachments

         <a href="/wiki/Bernina_model_1000">
           <img src="/wiki/index.php/File:Bernina1008.png" alt="Bernina model 1008">
         </a>

Bernina model 1008
Stitch control

         <a href="/wiki/Brother_1034DX">
           <img src="/wiki/Special:FilePath/Brother_1034DX.jpg" alt="Brother 1034DX">
         </a>

Brother 1034DX
Serger / Edges

         <a href="/wiki/Brother_PE770">
           <img src="/wiki/images/8/8d/BrotherPE770.jpg" alt="Brother PE770">
         </a>

Brother PE770
Embroidery machine

         <a href="/wiki/PGM_dress_forms">
           <img src="/wiki/Special:FilePath/PGM_dress_forms.jpg" alt="PGM dress forms">
         </a>

PGM dress forms
Collapsible form

         <a href="/wiki/Wacom_Cintiq_Tablet">
           <img src="/wiki/Special:FilePath/Wacom_Cintiq_Tablet.jpg" alt="Wacom Cintiq Tablet">
         </a>

Wacom Cintiq Tablet
Digital drawing

         <a href="/wiki/Cutting_Table">
           <img src="/wiki/Special:FilePath/Cutting_Table.jpg" alt="Cutting Table">
         </a>

Cutting Table
Fabric covered