Ene object starten nadat het andere object is gestopt

Status
Niet open voor verdere reacties.

gerbenkill1

Nieuwe gebruiker
Lid geworden
21 okt 2008
Berichten
1
Hoi allemaal,

Ik ben bezig met het maken van een kleine website. Hier wil ik eerst een soort begin pagina maken met een soort filmpje.

Nu heb ik dat, zodra de pagina wordt geladen direct een laadbalk van 0 % naar 100 % begint te 'lopen'. Hierna verdwijnt deze laadbalk automatisch.

Ik wil graag dat, nadat de laadbalk is verdwenen het volgende object, een script met een paar afbeeldingen te voorschijn komt.

Zowel de laadbalk als de afbeeldingen staan in een javascript.

Kunnen jullie helpen met het maken van een script waarmee dus de foto's te voorschijn komen nadat de laadbalk is verdwenen?

Alvast Bedankt!
 
Dat is zeer moeilijk als we het script van je laadbalk niet kennen...
Het meest logische zou zijn dat bij elke refresh van je laadbalk getest wordt of het aantal procent 100 is, en zoja, roep dan de functie die de laadbalk doet verdwijnen en de afbeeldingen toont.

Maar ja, het beste antwoord zou je natuurlijk krijgen als je je script post.
 
Laatst bewerkt:
Heel fijn dat je hebt willen kijken naar mijn probleem. Hierbij even het script van de laadbalk. Als je meer informatie nodig hebt moet je het vooral zeggen.

Alvast bedankt voor het meewerken

In het HEAD gedeelte:
<style type="text/css">

#Balk {
position:absolute;
left:0px;
top:0px;
width:300px;
background-color:#184EB8;
filter: Alpha(Opacity=0, FinishOpacity=100,Style=1,StartX=0,StartY=0,FinishX=200,FinishY=20) ;
height:100%;
z-index:5000;}

#balk_ag {
position:absolute;
left:50%;
top:10%;
width:300px;
height:20px;
border:1px solid #000000;
background-color:#eeeeee;
margin-left:-150px;
margin-top:-20px;
text-align:center;}

#balk_vg {
position:absolute;
left:0px;
top:0px;
width:0px;
height:100%;
overflow:hidden; }

#balk_tekst {
color:#000000;
z-index:10000;
width:100%;
height:100%;
left:0px;
top:0px;
position:absolute;
font-family:arial;
font-size:0.8em;
line-height:20px; } /* = hoogte Balk */
</style>

<script type="text/javascript">

var progressie,balk_ag,balk_vg,balk_tekst,balk_breedte;
var eenheid = 100; // 100 = vordering met 1%, 50 = vordering met 2%, ...
var huidigePositie = 0;

function wijzigBalk(stap) {

if(!balk_ag) {
progressie = document.getElementById('progressie');
balk_ag = document.getElementById('balk_ag');
balk_vg = document.getElementById('balk_vg');
balk_tekst = document.getElementById('balk_tekst');
balk_breedte = balk_ag.clientWidth;}

huidigePositie+= stap;
if (huidigePositie > eenheid) huidigePositie = eenheid;

var width = Math.ceil(balk_breedte * (huidigePositie / eenheid));
balk_vg.style.width = width + 'px';

var procent = Math.ceil((huidigePositie / eenheid) *100);
balk_tekst.innerHTML = procent + '%';

// laat de balk verdwijnen indien 100% bereikt:
if (huidigePositie==eenheid) {
setTimeout('document.getElementById("progressie").style.display="none"',50);}
}

/* Om de waarde te verhogen, de functie wijzigBalk() aanroepen
Bijvoorbeeld: wijzigBalk(1) om met 1 stap te verhogen
Of gebruik onderstaande automatische functie: */

function auto() {
if(huidigePositie < eenheid) {
wijzigBalk(1,5);
setTimeout('auto()',100);}}

window.onload=auto;
</script>

In het body gedeelte:

<div id="progressie">
<div id="balk_ag">
<div id="balk_vg">
<div id="Balk"></div></div>
<div id="balk_tekst">0 %</div></div></div>
 
Heel fijn dat je hebt willen kijken naar mijn probleem. Hierbij even het script van de laadbalk. Als je meer informatie nodig hebt moet je het vooral zeggen.

Alvast bedankt voor het meewerken

In het HEAD gedeelte:
Code:
<style type="text/css">
	
#Balk {
		position:absolute;
		left:0px;
		top:0px;
		width:300px;
		background-color:#184EB8;
		filter: Alpha(Opacity=0, FinishOpacity=100,Style=1,StartX=0,StartY=0,FinishX=200,FinishY=20) ;
		height:100%;
		z-index:5000;}
	
#balk_ag {
		position:absolute;
		left:50%;
		top:10%;
		width:300px;
		height:20px;
		border:1px solid #000000;
		background-color:#eeeeee;
		margin-left:-150px;	
		margin-top:-20px;
		text-align:center;}
	
#balk_vg {
		position:absolute;
		left:0px;
		top:0px;
		width:0px;	
		height:100%;
		overflow:hidden; }
	
#balk_tekst {
		color:#000000;
		z-index:10000;
		width:100%;
		height:100%;
		left:0px;
		top:0px;
		position:absolute;		
		font-family:arial;
		font-size:0.8em;
		line-height:20px; }	/* = hoogte Balk */
	</style>
	
<script type="text/javascript">

var progressie,balk_ag,balk_vg,balk_tekst,balk_breedte;
var eenheid = 100;	// 100 = vordering met 1%, 50 = vordering met 2%, ...  
var huidigePositie = 0;
	
function wijzigBalk(stap) {

if(!balk_ag) {
progressie   = document.getElementById('progressie');
balk_ag      = document.getElementById('balk_ag');
balk_vg      = document.getElementById('balk_vg');
balk_tekst   = document.getElementById('balk_tekst');
balk_breedte = balk_ag.clientWidth;}

huidigePositie+= stap;
if (huidigePositie > eenheid) huidigePositie = eenheid;

var width = Math.ceil(balk_breedte * (huidigePositie / eenheid));
balk_vg.style.width = width + 'px';

var procent = Math.ceil((huidigePositie / eenheid) *100);
balk_tekst.innerHTML = procent + '%';

// laat de balk verdwijnen indien 100% bereikt:
if (huidigePositie==eenheid) {
setTimeout('document.getElementById("progressie").style.display="none"',50);
ToonAfbeeldingen("Locatie Afbeelding 1 hier","Locatie Afbeelding 2 hier","Etc")}
}
	
/* Om de waarde te verhogen, de functie wijzigBalk() aanroepen 
Bijvoorbeeld: wijzigBalk(1) om met 1 stap te verhogen          
Of gebruik onderstaande automatische functie:                */  

function auto() {
if(huidigePositie < eenheid) {
wijzigBalk(1,5);
setTimeout('auto()',100);}}
                                          
window.onload=auto;

function ToonAfbeeldingen()
{
for(i=0;i<arguments.length;i++)
{
document.write(<IMG src='"+arguments[i]+"'>);
}
}
</script>

In het [B]body [/B]gedeelte:

<div id="progressie">
<div id="balk_ag">
<div id="balk_vg">
<div id="Balk"></div></div>
<div id="balk_tekst">0 %</div></div></div>[/QUOTE]

Ik heb de code wat aangepast, en er een functie in gestoken die, nadat de laadbalk verdwijnt, IMG-tags schrijft. In de argumenten van functie (Die wordt geroepen in het stukje met if (huidigePositie==eenheid)) schrijf je de URLs van je afbeeldingen.

EDIT: Dit is echter wel een ruw voorbeeld, zonder enige opmaak, dus je kan het dan natuurlijk zelf nog wat veranderen.
 
Laatst bewerkt:
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan