Problemet er så hvis fx der kun er udskrevet 2 divs, så kan scriptet ikke udføres da den ikke kan få fat i cat3, cat4, cat5, osv, og det samme med txt5, txt6, txt7 osv...
Hele scriptet ser sådanne ud: var showcat1 = 0; var showcat2 = 0; var showcat3 = 0; var showcat4 = 0; var showcat5 = 0; var showcat6 = 0; var showcat7 = 0;
Det ville måske endda være mere generisk at lade længden af array'et showcat styre hvormange iterationer der skulle udføres, for så skal du bare ændret antallet af elementer i showcat for at forøge eller formindske mængden af iterationer:
var showcat = [0,0,0,0,0,0,0];
function toggleGallery(img_id) { for(var i = 0; i < showcat.length; i++) { if(img_id == 1) { var cat = document.getElementById("gal_img" + (i + 1)); var txt = document.getElementById("imgtxt" + (i + 1)); if(txt && cat) { if(showcat[i] == 0) { cat.style.display = "block"; txt.style.display = "block"; showcat[i] = 1; } else { cat.style.display = "none"; txt.style.display = "none"; showcat[i] = 0; } } } } }
Det fungerer desværre ikke rigtig helt, den skjuler aldrig billederne igen, den skifter fint imellem text divs, og den viser også det nye billede hvis jeg klikker på fx den skal vise nr 2 billede, men den skjuler aldrig det første igen ?
---------------------------------
/// JAVASCRIPT GALLERY /// /// Made by Nicky Christensen - npc@dynamicweb.dk / nicky@meet-me.dk ///
var showcat = [0,0,0,0,0,0,0];
function toggleGallery(img_id) { for(var i = 0; i < 7; i++) { if(img_id == 1) { var cat = document.getElementById("gal_img" + (i + 1)); var txt = document.getElementById("imgtxt" + (i + 1)); if(txt && cat) { if(showcat[i] == 0) { cat.style.display = "block"; txt.style.display = "block"; showcat[i] = 1; } else { cat.style.display = "none"; txt.style.display = "none"; showcat[i] = 0; } } } // End if if(img_id == 2) { var cat = document.getElementById("gal_img" + (i + 1)); var txt = document.getElementById("imgtxt" + (i + 1)); if(txt && cat) { if(showcat[i] == 0) { cat.style.display = "block"; txt.style.display = "block"; showcat[i] = 1; } else { cat.style.display = "none"; txt.style.display = "none"; showcat[i] = 0; } } } // End if if(img_id == 3) { var cat = document.getElementById("gal_img" + (i + 1)); var txt = document.getElementById("imgtxt" + (i + 1)); if(txt && cat) { if(showcat[i] == 0) { cat.style.display = "block"; txt.style.display = "block"; showcat[i] = 1; } else { cat.style.display = "none"; txt.style.display = "none"; showcat[i] = 0; } } } // End if } // End for } // End function
Ja, du kan da godt bruge jQuery til at vise og skjule dine lag, hvis du vil have effekterne med. Det er i det mindste en noget lettere måde at gøre det på, end selv at lave det. Jeg har endnu ikke arbejdet meget med jQuery (men jeg regner med at komme til det i nær fremtid), så jeg kan ikke give de vilde guldkorn på den konto. Sitet du henviser til synes dog også at gøre et OK arbejde med at forklare hvordan du skal gøre for at få slide-effekten, så det kan du i princippet klippe derfra...
Er det ikke meget lettere at opbevare informationen om, hvad der blev vist hidtil:
var showcat = 1;//Tager udgangspunkt i, at det først viste er nr. 1
function toggleGallery(img_id) { i = 1; while(cat = document.getElementById("gal_img" + i))//forudsætter at det starter med 1 og alle tal er brugt cat.style.display = document.getElementById("imgtxt" + i++).style.display = "none"; document.getElementById("gal_img" + img_id).style.display = "block"; document.getElementById("imgtxt" + img_id).style.display = "block"; showcat = img_id; }
Synes godt om
Ny brugerNybegynder
Din løsning...
Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.
