[Javascript pop-up] Automatisch laten aanpassen aan inhoud? - Softwareontwikkeling

zaterdag 15 februari 2003 21:44

Acties:

Vincam aut moriar

Topicstarter

Ik heb een website met in het menu een cartoon. Deze wordt wekelijks ververst. Mensen moeten het plaatje klikken om een groter exemplaar te krijgen. Dit groter exemplaar komt in een pop-up window. Het is de enige pop-up die ik op de site gebruik.
Deze code gebruik ik:

code:

<script>
//Pop-up Window Script
function openpopup(){
var popurl="plaatje.htm"
winpops=window.open(popurl,"","width=600,height=425,status,")
}

</script>
  <a href="javascript:openpopup()">[img]"plaatje.jpg"[/img]</a>

De afmetingen van de cartoons zijn iedere keer weer anders. Hoe kan ik er nou voor zorgen dat de pop-up window zich automatisch aanpast aan het plaatje dat er in komt? Misschien dat ik de heigt en width van die plaatjes als variabelen moet zien ofzo, maar ik heb weinig verstand van scripting.

Het pop-up script heb ik al met veel pijn en moeite mbv een tutorial gemaakt, dus veel moeilijker moet ik het nou óók weer niet hebben

We zijn allemaal vaandeldrager in een optocht van gekwetsten.

zaterdag 15 februari 2003 22:11

Acties:

Verwijderd

• Wat moet er allemaal gebeuren?
- De afmetingen van het plaatje moeten worden opgevraagd
- Er moet een popup worden geopend met het plaatje erin

Het probleem is simpel genoeg, het oplossen valt ook wel mee:

JavaScript:

// maak een image object, hier kunnen we het plaatje in 'preloaden'
cartoon = new Image();

// verbind een referentie naar een functie aan het onload event
// de functie gaan we zometeen definiëren
cartoon.onload = doPopup;

// laad een plaatje in het object
cartoon.src = 'http://www.domein.com/plaatje.gif';

// nu kunnen we de functie schrijven
function doPopup() {
   // open een venster, en geef het venster de hoogte en breedte van het plaatje in ons object
   popup = window.open('','','width=' + cartoon.width + ',height=' + cartoon.height,scrollbar=0,toolbar=0,status=0);
   // open het document in de popup, zodat we er HTML in kunen schrijven
   popup.document.open();
   // schrijf wat noodzakelijke HTML
   popup.document.write('<html>');
   popup.document.write('<head><title>Cartoon</title></head>');
   // zet de marges van de body op 0, zo krijgen we geen randje om het plaatje
   popup.document.write('<body style="margin:0;padding:0;">');
   // de image tag, gevuld met de locatie van ons object
   // let goed op de enkele en dubbele quotes!
   popup.document.write('<img src="' + cartoon.src + '" alt="cartoon" />');
   // maak de HTML verder af
   popup.document.write('</body>');
   popup.document.write('</html>');
   // sluit het document, wel zo netjes
   popup.document.close();
}

Het stelt niet zo gek veel voor, het is een combinatie van wat eenvoudige dingetjes, die je toch wel uit een tutorial kunt halen. Als je trouwens wilt weten welke properties of methoden er zijn, die je kunt gebruiken, kijk dan eens in een reference guide.

[ Voor 4% gewijzigd door Verwijderd op 15-02-2003 22:13 ]

zondag 16 februari 2003 11:18

Acties:

Rexomnium

Vincam aut moriar

Topicstarter

Dank je voor je uitgebreide reactie, maar wat ik niet snap is dat ik met jouw versie geen link krijg naar de pop-up, maar meteen een venster geopend krijg als ik op de site kom.

We zijn allemaal vaandeldrager in een optocht van gekwetsten.

zondag 16 februari 2003 14:44

Acties:

teacher

Frontpage Admin / Global Moderator

Dysgaf!

er staat nu cartoon.onload....

Je kan de functie doPopup toch gewoon aanroepen met een link?

Wise enough to play the fool

vrijdag 5 december 2003 21:06

Acties:

Verwijderd

Ik zelf kan dit script ook heel goed gebruiken maar hoe moet ik het toepassen als ik een paar 100 foto's heb?

grtz -=Tc.=-

zaterdag 6 december 2003 00:24

Acties:

crisp

Devver

Pixelated

Verwijderd schreef op 05 december 2003 @ 21:06:
Ik zelf kan dit script ook heel goed gebruiken maar hoe moet ik het toepassen als ik een paar 100 foto's heb?

grtz -=Tc.=-

Ga zelf eens iets bedenken, en als je er dan nog niet uitkomt mag je een nieuw topic openen. Op een oud topic als dit verder gaan is weinig zinvol...

Intentionally left blank