[HTML] Afbeelding laden na pagina * - Softwareontwikkeling

donderdag 9 december 2004 10:45

Acties:

Topicstarter

Een hele tijd geleden heeft mijn baas een systeem gemaakt waar mensen hun eigen startpagina konden beginnen. Dit is tot de dag van vandaag succesvol, TE succesvol. Het script is geschreven in zijn begindagen en is daarom onoverzichtelijk en laad langzaam.

Recent hebben we een optie toegevoegd om een afbeelding toe te voegen boven elke rubriek met links (net zoals Startpagina.nl dus, boven elke nieuwe categorie een plaatje). Om de kosten niet nog meer te laten stijgen hebben we ervoor gekozen om mensen zelf een plaats te laten zoeken waar ze hun afbeelding kunnen uploaden. Meestal is dit hun eigen provider webspace of Imageshack.us enz.

Probleem is nu: als de server waarop de afbeelding staat traag is, dan is de hele pagina dit. Ik zoek dus een manier om die twee te scheiden. Dus eerst de pagina laden, en daarna pas de afbeeldingen (of niet indien de afbeelding niet bestaat).

Al geprobeerd om dingen aan de HTML en PHP te veranderen, of image pre-loaders te gebruiken, maar het haalt allemaal niks uit. Ik zit hier dus met mn handen in het haar, hulp is meer dan welkom

Thx alvast.

donderdag 9 december 2004 10:47

Acties:

André

Analytics dude

Zet op de body een onload en roep daar een script aan wat dan pas het plaatje in gaat laden en aan de body toevoegt.

donderdag 9 december 2004 10:48

Acties:

Verwijderd

Ik geloof dat ze op GoT een tijdje terug ook een dergelijke constructie hebben moeten maken omdat de banners af en toe niet vlot binnenkwamen en daardoor de hele pagina pas na een tijd verscheen. Misschien dat je het terug kan vinden

donderdag 9 december 2004 10:49

Acties:

BtM909

Watch out Guys...

Je zou een container kunnen gebruiken (container.gif) die leeg is en onload (met JavaScript nadat de pagina is geladen) het plaatje laden.

Probleem is wel dat mensen zonder JS geen plaatje zien.

Je kan er ook voor kiezen om een iFrame te gebruiken. De meeste browsers zullen dan seperaat 2 documenten (je hoofd-document en de iFrame met pic) laden

Ace of Base vs Charli XCX - All That She Boom Claps (RMT) | Clean Bandit vs Galantis - I'd Rather Be You (RMT)
You've moved up on my notch-list. You have 1 notch
I have a black belt in Kung Flu.

donderdag 9 december 2004 10:56

Acties:

BlueAce

Topicstarter

De "onload" oplossing heb ik al geprobeerd zoals ik zei, maar dat haalt niks uit. Logisch ook enigszins.

Met iframes zou kunnen, maar ik ben niet echt blij met zo'n oplossing. De grote van de afbeelding kan varieren, en dus moet ik dat dan ook doorbereken voor de iframe, wat dus nog meer load betekend. In ieder geval waard om te proberen, thx

Ik zal even zoeken naar dat banner geval...

donderdag 9 december 2004 10:58

Acties:

BtM909

Watch out Guys...

BlueAce schreef op donderdag 09 december 2004 @ 10:56:
De "onload" oplossing heb ik al geprobeerd zoals ik zei, maar dat haalt niks uit. Logisch ook enigszins.

Hoezo logisch

je maakt toch wel gebruik van een <body onload=""> of window.onload = ?

En wat die iFrame betreft: ik neem aan dat je een maximale grootte hanteert ?

Op GoT wordt tegenwoordig een div-je gebruikt die een plaatje laadt, vlak voor de </body> tag (in principe nadat het grootste gedeelte al is gerendered)

[ Voor 38% gewijzigd door BtM909 op 09-12-2004 11:01 ]

Ace of Base vs Charli XCX - All That She Boom Claps (RMT) | Clean Bandit vs Galantis - I'd Rather Be You (RMT)
You've moved up on my notch-list. You have 1 notch
I have a black belt in Kung Flu.

donderdag 9 december 2004 11:02

Acties:

BlueAce

Topicstarter

Tja, ik weet het ook niet. "body onload=" werkt gewoon niet, dat is wat ik zie

Misschien logisch omdat ie ze dan toch moet laden op het moment dat de <body> tag wordt aangeroepen, en alsnog de rest van de content daarna pas doet.

Maximale breedte wordt afgedwongen in het beheersysteem, hoogte niet.

donderdag 9 december 2004 11:07

Acties:

marko77

Is het plaatsen van het plaatje als achtergrond in een tabel (of div b.v.) geen oplossing?

volgens mij laad je browser de plaatjes voor je stylesheet apart in (lees later dan de pagina)

als het plaatje dan langzaam laad zie je de pagina al wel.

Zelf merk ik namelijk wel eens dat mn css backgrounds nog ontbreken als de pagina al geladen is.

Mijn rig

donderdag 9 december 2004 11:11

Acties:

André

Analytics dude

BlueAce schreef op donderdag 09 december 2004 @ 11:02:
Tja, ik weet het ook niet. "body onload=" werkt gewoon niet, dat is wat ik zie Misschien logisch omdat ie ze dan toch moet laden op het moment dat de <body> tag wordt aangeroepen, en alsnog de rest van de content daarna pas doet.

Maximale breedte wordt afgedwongen in het beheersysteem, hoogte niet.

Met onload word pas begonnen als de hele pagina klaar is, dus dat is precies wat je zoekt. Alleen dan moet je het wel goed implementeren en niet alvast het plaatje gaan preloaden oid.

donderdag 9 december 2004 11:41

Acties:

BlueAce

Topicstarter

Aha, ik dacht dat je een pre-loader bedoelde

Iframe is toch teveel extra opmaak en extra parsetime. Nu maar proberen met Javascript dus.

donderdag 9 december 2004 12:22

Acties:

BlueAce

Topicstarter

Even een voorbeeld van de javascript die ik nu heb laten genereren via PHP:

code:

function show_imgs ()
{
   img_3.src = "http://epsc.wustl.edu/seismology/webimages/globe.gif";
   img_9.src = "http://www.clerx.nl/Genealogy/vuistbijl.jpg";
}

... en natuurlijk: <body onload="show_imgs()">

Wat ik nu dus krijg: hij laad nu alle images, en laat ze daarna pas zien. Eigenlijk zou dat dus 1 voor 1 moeten gebeuren. Even kijken hoe ik dat ga doen, maar suggesties zijn ondertussen welkom wederom

[ Voor 7% gewijzigd door BlueAce op 09-12-2004 12:22 ]

donderdag 9 december 2004 12:43

Acties:

André

Analytics dude

BlueAce schreef op donderdag 09 december 2004 @ 12:22:
Even een voorbeeld van de javascript die ik nu heb laten genereren via PHP:
code:
1
2
3
4
5
function show_imgs ()
{
   img_3.src = "http://epsc.wustl.edu/seismology/webimages/globe.gif";
   img_9.src = "http://www.clerx.nl/Genealogy/vuistbijl.jpg";
}
... en natuurlijk: <body onload="show_imgs()">

Wat ik nu dus krijg: hij laad nu alle images, en laat ze daarna pas zien. Eigenlijk zou dat dus 1 voor 1 moeten gebeuren. Even kijken hoe ik dat ga doen, maar suggesties zijn ondertussen welkom wederom

Dit word door de browser afgehandeld en is alleen te beinvloeden door zelf een script te maken dat plaatje voor plaatje inlaad

donderdag 9 december 2004 13:00

Acties:

RM-rf

1 2 3 4 5 7 6 8 9

BlueAce schreef op donderdag 09 december 2004 @ 12:22:
Even een voorbeeld van de javascript die ik nu heb laten genereren via PHP:
code:
1
2
3
4
5
function show_imgs ()
{
   img_3.src = "http://epsc.wustl.edu/seismology/webimages/globe.gif";
   img_9.src = "http://www.clerx.nl/Genealogy/vuistbijl.jpg";
}
... en natuurlijk:

Wat ik nu dus krijg: hij laad nu alle images, en laat ze daarna pas zien. Eigenlijk zou dat dus 1 voor 1 moeten gebeuren. Even kijken hoe ik dat ga doen, maar suggesties zijn ondertussen welkom wederom

Ik vermoed dat hij wat totdat de toewijzing van een img.src klaar is (geladen dus) om met de volgende door te gaan, de toewijzing valt dan te gebruiken als een soort van conditie, waarmee je onerors zou kunnen afvangen en die zelf al als een onload voor de IMG werkt, wat voor brakke scripting vaak handig kan zijn (bv de scripting die eerst een img laad en dan direkt de width en hoogte opvraagt, zonder dit in een onload te zetten)..

Ik vermoed dat dit te voorkomen is door niet zozeer een img.src = 'plaatje.gif' _plat_ aan te roepen, echter in je opnload functie zelf een andere functie aan te reopen die de toewijzing regelt:

code:

function init() {
   imgLoader( 'img3', 'plaatje.gif' )
   imgLoader( 'img4', 'anderplaatje.gif' )
}
function imgLoader( img, src ) {
   document.images[ img ].src = src 
}

mocht dat niet werken kun je eventueel altijd met een setTimeout( "imgLoader( 'img3', 'plaatje.gif')", 1 ), die retoruneert soweiso enkel een integer als referentie naar een timeout waarde, maar verder geen output van de functie en wacht dus verder niet

Intelligente mensen zoeken in tijden van crisis naar oplossingen, Idioten zoeken dan schuldigen

donderdag 9 december 2004 13:04

Acties:

Verwijderd

Bij mijn vorige werkgever plaatsten ze de banners in een iframe. Dit zou je dus ook kunnen toepassen in jouw situatie.

donderdag 9 december 2004 13:56

Acties:

BlueAce

Topicstarter

Verwijderd schreef op donderdag 09 december 2004 @ 13:04:
Bij mijn vorige werkgever plaatsten ze de banners in een iframe. Dit zou je dus ook kunnen toepassen in jouw situatie.

Lezen?

In mijn situaties is dat niet van toepassing.

Met een vergelijkbare functie als die van RM-rf is het me uiteindelijk gelukt. Hij laad nog steeds wel traag voor de rest, en dus ga ik binnenkort maar eens de hele site vanaf de grond opbouwen. Bedankt iig!

donderdag 9 december 2004 13:58

Acties:

gorgi_19

Kruimeltjes zijn weer op :9

* gorgi_19 ziet allemaal clientside dingetjes.
* gorgi_19 vindt dat eng.
* gorgi_19 gooit het daarom maar over de schutting.
* gorgi_19 vindt het weer opgeruimd

>> Webdesign & Graphics

Digitaal onderwijsmateriaal, leermateriaal voor hbo

donderdag 9 december 2004 14:06

Acties:

Verwijderd

Lezen? In mijn situaties is dat niet van toepassing.

Als ik het goed begrijp wil je graag dat de pagina gelijk wordt getoond en niet wordt gewacht op de plaatjes van andere servers. Door het plaatje in een iframe te laden, krijg je precies dit effect.

Pagina: 1

Reageer