 Crew PHP |
|
Ik begrijp niet helemaal wat je doen wilt  Gebaseerd op het 'loop' in loopdiv, ga ik uit dat je een soort slideshow wilt maken. Wat je nu doet met JS, is alle divs top+left: 0 geven en alle images 20 bij 20px.
Ik ga dus even verder op dat je een slideshow wilt, in dat geval zit je er redelijk naast 
Een goede manier:
CSS:
- #Loopdiv krijgt position relative, met een width+height+ overflow:hidden;
- #Loopdiv div{} krijgt position absolute, top+left:0, z-index: 1;
Nu staan al je 'slides' op dezelfde plek over elkaar heen.
JS:
- tel aantal slides, zet deze in een globale variabel (dus een var slideCount buiten functies plaatsen)
- Maak een start waarde aan, aannemelijk de eerste (maar zo kun je een random maken): var CurrentSlide = -1; // de slide die je wilt als startslide, -1
En dan een stukje code omdat dat makkelijker is dan verwoorden
var slideCount = loopdiv.getElementsByTagName('div').length;
var CurrentSlide = -1; // startslide -1
setTimeout(function(){
// Hier code dat we willen doen:
if(CurrentSlide >=0){
div[CurrentSlide].zIndex=1; // Zet huidig active slide op normale z-index
// Ga naar volgende slide
CurrentSlide++;
//Indien laatste slide bereikt, terug naar de eerste:
if( CurrentSlide == slideCount ){ CurrentSlide = 0;}
// Zet deze slide nu vooraan
div[CurrentSlide].zIndex=10;
}
}, 1000); // Doe dit elke x (nu 1000) millisec
var slideCount = loopdiv.getElementsByTagName('div').length; var CurrentSlide = -1; // startslide -1 setTimeout(function(){ // Hier code dat we willen doen: if(CurrentSlide >=0){ div[CurrentSlide].zIndex=1; // Zet huidig active slide op normale z-index // Ga naar volgende slide CurrentSlide++; //Indien laatste slide bereikt, terug naar de eerste: if( CurrentSlide == slideCount ){ CurrentSlide = 0;} // Zet deze slide nu vooraan div[CurrentSlide].zIndex=10; } }, 1000); // Doe dit elke x (nu 1000) millisec
LET OP! Dit is even een snelle schets, kan zijn dat het net even anders moet, en het zou ietsje handiger kunnen met wat meer variabelen, maar dit is duidelijk genoeg denk ik |
Wat is jouw favoriete javascript framework? (S: 18, R: 2)
Gesponsorde links
Actiefste leden van de maand
