Home | Menu

Dynamisch horizontaal

Vragen? Forum!

Download hier code en uitleg (4,2 MB).

Uitleg online lezen.

Kies via een dropdownmenu een afbeelding en open de bijbehorende pagina

Spring naar de inhoud

Kies een afbeelding

? Als de pagina opent, staat er een rij witte vlakken. Als je daar met de cursor overheen beweegt, verschijnt een tweede serie witte vlakken of een serie links.
Als je de cursor over een link beweegt, opent een afbeelding.
Als een tweede serie witte vlakken opent, werkt dit net zo: als je de cursor eroverheen beweegt, verschijnt een serie links.

Als je op een link klikt, opent een pagina met meer info over de getoonde afbeelding. Je kunt daar bijvoorbeeld de afbeelding downloaden door erop te rechtsklikken, copyleft info geven, enz. (Die pagina's zijn verder hartstikke leeg, ik had geen zin om 191 pagina's te gaan vullen...)

Elke bij elkaar horende serie witte vlakken of links is omgeven door een groen blok. Als je de cursor over het bij de serie horende groene blok beweegt (dus niet over het witte vlak of de link), kun je de cursor bewegen zonder dat er iets opent.

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin sed justo sed nisi interdum rutrum. Etiam adipiscing, dolor quis ultrices tempus, pede ante porta nulla, et auctor turpis odio quis dolor. Maecenas vitae leo vehicula urna vestibulum faucibus. Pellentesque adipiscing hendrerit justo. Quisque in mauris a mi varius convallis. Curabitur ut odio. Sed ultricies turpis eget dui. Nulla bibendum, justo ultrices placerat iaculis, pede nunc tempus purus, vel tincidunt purus enim a urna. Curabitur non risus sit amet augue gravida volutpat. In id urna. Quisque pede. Donec erat dolor, pretium ac, bibendum ut, pulvinar quis, purus. Sed accumsan aliquam sem. Vivamus pharetra venenatis arcu.

Pellentesque egestas turpis eu neque. In vitae nisl sed justo eleifend accumsan. Curabitur gravida ultricies neque. Quisque eu tellus vitae lorem tincidunt tempor. Suspendisse tincidunt dictum lorem. Suspendisse ultrices. Mauris lobortis tellus nec diam posuere aliquet. Proin vel enim. Aliquam a neque. Curabitur suscipit lobortis lacus. Cras ligula risus, scelerisque nec, dapibus vel, rhoncus at, dui. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Cras in sem. Etiam vitae lectus. Maecenas libero est, posuere et, volutpat id, interdum non, lorem. Proin ligula. Aliquam est ligula, facilisis a, pellentesque eget, pellentesque non, dui.

Integer nisl tellus, aliquam ut, sagittis eu, ullamcorper blandit, nulla. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed sed dui. Quisque ac urna. Aenean vestibulum nibh in justo. Morbi elit lectus, pulvinar quis, volutpat sed, auctor et, lacus. Donec rutrum nibh et ante. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque tortor. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Donec tincidunt. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Curabitur volutpat mi a augue. Proin nulla risus, cursus id, vestibulum eget, feugiat quis, lacus. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla tempus adipiscing pede.