Script met uitrollmenu
Ik heb nog verder gezocht naar een iets uitgebreider script
Maar om dat het rond 60 dieren gaat + hun eigenschappen wil ik dit gaan gebruiken
zonder dat het script automatisch loopt.
weet iemand wat ik dan weg moet halen ?
[JS]<html>
<head>
<script type="text/javascript"><!--
var pauze=5000 // aantal milliseconden
var displaymode="manueel"
if (document.getElementById){
document.write('<style type="text/css">\n')
document.write('.vensterinhoud{display:none;}\n')
document.write('</style>\n')}
var selectedDiv=0
var totalDivs=0
function getElementbyClass(classname){
partscollect=new Array()
var inc=0
var alltags=document.all? document.all.tags("DIV") : document.getElementsByTagName("*")
for (i=0; i<alltags.length; i++){
if (alltags.className==classname)
partscollect[inc++]=alltags}}
function contractall(){
var inc=0
while (partscollect[inc]){
partscollect[inc].style.display="none"
inc++}}
function expandone(){
var selectedDivObj=partscollect[selectedDiv]
contractall()
selectedDivObj.style.display="block"
temp.options[selectedDiv].selected=true
selectedDiv=(selectedDiv<totalDivs-1)? selectedDiv+1 : 0
if (displaymode=="auto")
autocontrolvar=setTimeout("expandone()",pauze)}
function inhoud_naar_menu(){
temp=document.gallerycontrol.menu
for (m=temp.options.length-1;m>0;m--)
temp.options[m]=null
for (i=0;i<totalDivs;i++){
var onderwerp=partscollect.getAttribute("subject")
onderwerp=(onderwerp=="" || onderwerp==null)? "HTML Content "+(i+1) : onderwerp
temp.options=new Option(onderwerp,"")}
temp.options[0].selected=true}
function manueelcontrol(menuobj){
if (displaymode=="manueel"){
selectedDiv=menuobj
expandone()}}
function keuze_optie(themode){
displaymode=themode
if (typeof autocontrolvar!="undefined")
clearTimeout(autocontrolvar)
if (themode=="auto"){
document.gallerycontrol.menu.disabled=true
autocontrolvar=setTimeout("expandone()",pauze)}
else document.gallerycontrol.menu.disabled=false}
function startgallery(){
document.getElementById("controldiv").style.display="block"
getElementbyClass("vensterinhoud")
totalDivs=partscollect.length
inhoud_naar_menu()
for (i=0; i<document.gallerycontrol.mode.length; i++){
if (document.gallerycontrol.mode.checked)
displaymode=document.gallerycontrol.mode.value}
if (displaymode=="auto")
document.gallerycontrol.menu.disabled=true
expandone()}
if (window.addEventListener)
window.addEventListener("load", startgallery, false)
else if (window.attachEvent)
window.attachEvent("onload", startgallery)
else if (document.getElementById)
window.onload=startgallery
// -->
</script>
<style type="text/css"><!--
.keuzelijst { background-color: #00ff66; padding-top: 3px; width: 244px; red: }
.vensterinhoud { background-color: #ffff00; padding: 3px; border: solid 1px #a52a2a; width: 250px; height: 110px }-->
</style>
</head>
<body>
<div class="vensterinhoud" subject="Keuzetekst 1">
Hier komt de tekst die hoort bij 'Keuzetekst 1'.</div>
<div class="vensterinhoud" subject="Tekst naar keuze 2">
Na een instelbare pauze verschijnt 'Tekst naar keuze 2'.</div>
<div class="vensterinhoud" subject="Willekeurige tekst 3">
Je hebt de keuze tussen automatisch of manueel.</div>
<div class="vensterinhoud" subject="Tekst nummer 4">
<span class="rood">Alle HTML-opmaak is mogelijk.</span></div>
<div class="vensterinhoud" subject="Kunnen afbeeldingen ook?">
Afbeeldingen of <a href="#">hyperlinks</a> zijn evenmin een probleem.<br>
<img src="../pics/foto1.jpg" height="60" width="100"></div>
<div id="controldiv" style="display:none" class="keuzelijst">
<form name="gallerycontrol">
<select class="keuzelijst" size="3" name="menu" onchange="manueelcontrol(this.options.selectedIndex)">
</select> Automatisch: <input type="radio" checked name="mode" value="auto" onclick="keuze_optie('auto')"> Manueel: <input type="radio" name="mode" value="manueel" onclick="keuze_optie('manueel')">
</form>
</div>
</body>
</html>
[/JS]