Juiste locatie van mijn afbeeldingen

[Toegang]

In een tabel heb ik op één plek een grote foto. Op een ándere plek heb ik een aantal thumbnail-afbeeldingen. Als ik er met de muis overheen ga wil ik dat de grote foto vervangen wordt een de grote versie van die thumbnail-afbeelding.

Op interner heb ik het volgende gevonden om het plaatje te positioneren:

<style type='text/css'>
.afbeelding
{
	position:absolute;
	top:191;
	left:63;
	visibility:hidden;
}
<style>

en

<div id="fig1" class="afbeelding">
	<img src="fig1.jpg">
</div>

Hiermee komt de afbeelding bij iedereen op een andere plek, afhankelijk van of hij wel of niet de geschiedenis of favorieten aan heeft staan.
Hoe kan ik de afbeelding in die ene cel van de tabel plaatsen ongeacht de indeling van het scherm?

 

[hackerfrans]

Deze code heeft niets van doen met favorieten of geschiedenis.
Door de afbeelding niet in een div te platsen maar direct in de tabelcel zal hij altijd daar staan. geen absolute positionering zoals je nu gebruikt is daar voor nodig.

 

[Toegang]

Misschien heb ik m´n probleem niet genoeg duidelijk gemaakt.

Ik heb een pagina waar ik 1 grote foto en een aantal kleine foto´s heb staan. De afbeeldingen heb ik gepositioneerd mbv een tabel. De grote en kleine plaatjes staan niet in de zelfde cel.

Als ik met de muis over een klein plaatje ga wil ik de al aanwezige grote afbeelding vervangen door de grote versie van dat kleine plaatje

Hoe zou ik jouw opmerking hierin moeten verwerken. In die ene cel waar de grote afbeelding staat alle grote afbeeldingen over elkaar heen plaatsen en alleen 1 daarvan zichtbaar maken? En zo ja, hoe gaat dat dan in zijn werking.

 

[teacher]

let me think...

Je hebt 2 dingen nodig:

1. de thumbnail waaraan je een eventhandler knoopt
2. een image met een naam.

Daarna is het een kwestie van dmv de evenhandlers de src te wijzigen:

Hier je "lege" plaatjes houder:

<img src="leeg.jpg" name="laat_zien" border="0" / >

Hier je thumbnails:

<img src="jouw_thumbnail_1.jpg"border="0" onClick="document.images['laat_zien'].src='jouw_grote_plaatje_1.jpg'" / >

<img src="jouw_thumbnail_2.jpg"border="0" onClick="document.images['laat_zien'].src='jouw_grote_plaatje_2.jpg'" / >

etc.

oh ja.. ik heb het niet getest ofzo, dus al ik een typo heb gemaakt; vergeef me

 

[Toegang]

DANK JE WEL, het werkt.

Alleen een ander vraagje, vanwaar die forward slash aanhet einde van elke img-tag?

 

[hackerfrans]

Dat is de XML manier.

 

[teacher]

Geplaatst door Toegang
DANK JE WEL, het werkt.

Alleen een ander vraagje, vanwaar die forward slash aanhet einde van elke img-tag?

tuurlijk werkt het

die slash aan het einde is er eigenlijk voor om de tag netjes "af te sluiten".

De regel is dat elke tag die je begint, ook afgesloten moet worden:
<p>
blaat blaat
</p>

Maar bij een aantal tags is er geen suit tag:
</br> bestaat niet, en </img> ook niet.
Dus is er besloten om enkele tags op die manier af te sluiten.

t.