Gå til innhold

Sette innhold til "parent" til en iframe

ZoRaC

Anbefalte innlegg

ZoRaC

ZoRaC

Skrevet
Skrevet

Har en side som laster en god del JS, bilder, o.l, noe som fører til lang loading-tid.

Jeg prøver å få til en "preloader", slik at det vises en melding mens siden lastes, og den eneste måten jeg har funnet er å laste siden i en skjult iFrame mens den viser en "Loading..."-tekst.

 

Det jeg nå skulle ha gjort er å erstatte innholde i parent med innholdet i iFrame'en når siden er ferdig lastet.

Er dette mulig?

 

Foreløpig har jeg gjort det slik, men den laster jo egentlig siden på nytt...

index.htm:

<html>
<head></head>
<body>
Loading...<br>
<iframe src="test.php" style="display:none;">
</body>
</html>

test.php: 

<html>
<head></head>
<body onLoad="parent.location.href = 'test.php';">
<?php sleep(5); ?>
Side!
</body>
</html>

Lenke til kommentar

Videoannonse

Videoannonse
Annonse
grimjoey

grimjoey

Skrevet
Skrevet (endret)

kan du ikke heller:

 

<html>
<body>
<style type="text/css">
#content {
display: none;
}

</style>
<script language="javascript" type="text/javascript">
onload = function () {
var loading = document.getElementById('loading');
var content = document.getElementById('content');

loading.style.display = 'none';
content.style.display = 'block';

}

</script>
<div id="loading">Loading...</div>
<div id="content">

Innhold

<img src="http://speedometer.dinside.no/php/surf/lastned/2mb.jpg" alt="tekst" />

</div>
</body>
</html>

 

eller:

<html>
<body>
<style type="text/css">
#content {
display: none;
}

</style>
<script language="javascript" type="text/javascript">

var t;

function loadingDots() {

var loading = document.getElementById('loading');
var length = loading.innerHTML.length;
if (length >= 7 && length <= 11) {
	loading.innerHTML = loading.innerHTML + '.';

} else {
	loading.innerHTML = loading.innerHTML.substr(0,7);

}

t = setTimeout('loadingDots()', 500);

}

onload = function() {
clearTimeout(t);

var loading = document.getElementById('loading');
var content = document.getElementById('content');

loading.style.display = 'none';
content.style.display = 'block';

}

</script>
<div id="loading">Loading</div>
<script type="text/javascript" language="javascript">
loadingDots();
</script>

<div id="content">

Innhold

<img src="http://speedometer.dinside.no/php/surf/lastned/2mb.jpg" alt="tekst" />

</div>
</body>

 

red:

testet i ff ie og opera.

opera har en litt annen oppførsel en de andre. det virker som den trigger onload eventen med en gang og viser innholdet mens den laster bildet. vet ikke om det samme gjelder js og alt det andre du har tenkt å laste. du får bare prøve.

Endret av grimjoey
Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Du må være et medlem for å kunne skrive en kommentar

Opprett konto

Det er enkelt å melde seg inn for å starte en ny konto!

Start en konto

Logg inn

Har du allerede en konto? Logg inn her.

Logg inn nå
Gå til emneliste
×
×
  • Opprett ny...