ميډياويکي:Multibilde.js

/**
 * Beskrivelse: Viser klikkbare bildeserier.
 * Assosierte maler: Mal:Alternativbilder, Mal:Standardbilde, Mal:Alternativbilde
 * Kontaktperson: BjørnN
 */

 function nextImage(iImage, dir)                           // iImage - løpenummer for bildegruppe
 {                                                         // dir    - retning, -1 er forrige, +1 er neste
     var pics = document.getElementById("vekselbilde" + iImage);
     var first = 1;                                        // indeks for første bilde

     for (var j = 1; j < pics.childElementCount; j++) {
       if (!$(pics.children[j]).hasClass("hide")) {        // finn bildet som momentan blir vist
         var k = j + dir;                                  // forrige eller neste bilde
         if (k < first) k = pics.childElementCount-1;      // logikk for å klikke alle bildene rundt
         if (k >= pics.childElementCount) k = first;

         $(pics.children[j]).addClass("hide");             // skjul vist bilde
         $(pics.children[k]).removeClass("hide");          // vis forrige eller neste

         var parag = pics.getElementsByTagName( "p" );
         var button = parag[0].childNodes[1];              // dersom sekvensnummer blir vist
         button.data = button.data.replace(/\(\d+/,"("+k); // aktualiser dette
         break;
       }
     }
 }

 function checkMultiImages()
 {
     var divs = document.getElementsByTagName( "div" );

     for ( var i = 0, j = 0; i < divs.length; i++ ) {      // j er løpenummer for div class="vekselbilde"
       if ($(divs[i]).hasClass("vekselbilde")) {
         divs[i].id = "vekselbilde" + j;                   // husk denne div-en
         var parag = divs[i].getElementsByTagName( "p" );  // finn knappeteksten
         var pButton = parag[0];

         if (!pButton.textContent)                         // default knappetekst er (1/<antall bilder>)
           pButton.textContent = "(1/" + (pButton.parentElement.childElementCount-1) + ")";

         var link = document.createElement( "a" );         // legg til anker med pil mot venstre
         link.href = "javascript:nextImage(" + j + ", -1);";
         link.title = "forrige bilde";
         link.innerHTML="\&#9668";
         pButton.appendChild( link );
         pButton.appendChild( pButton.firstChild );
         link = document.createElement( "a" );             // ... og mot høyre
         link.href = "javascript:nextImage(" + (j++) + ", +1);";
         link.title = "neste bilde";
         link.innerHTML="\&#9658";
         pButton.appendChild( link );
         $(pButton).removeClass("hide");                   // vis knappen
       }
     }
 }

 jQuery( document ).ready( checkMultiImages );