Avatar billede ssundsdal Nybegynder
17. april 2007 - 21:11 Der er 1 kommentar og
1 løsning

Show/hide layer med Dropdown menu

jeg forsøger at få lavet en dropdown menu som skal vise mine skjulte layers, på den måde når man klikker på dropdown menuen kan man fx vælge side 2 og når man så klikker på den så skal det skjulte layer blive vist nedenunder..
Min skjulte layers virker fint hvis jeg bruger link, det mere tricky er bare når jeg ska smide det ind i dropdownmenuen..

dropdown:

</head>
<form id="menu" action=""><p>
<select size="1" onchange="window.open(this.options[this.selectedIndex].value,'_self')">
<option selected="selected">Test</option>
<option value="#">Side 1</option>
<option value="#">Side 2</option>
</select>
</p></form>

skjulte layers:

<script language="JavaScript" s_rc="showhide.js">

function show_hide_layers() {
    var i, visStr, args, theObj;
    args = show_hide_layers.arguments;

    for (i = 0; i < (args.length - 1); i += 2 ) {
        theObj = args[i];
        visStr = args[i+1];
        if ( (navigator.appName == 'Netscape') && (document.layers != null) ) {
            if (theObj){ theObj.visibility = visStr; }
        } else if ( document.all != null ) {
            if (visStr == 'show') { visStr = 'visible'; }
            if (visStr == 'hide') { visStr = 'hidden'; }
            if (theObj) { theObj.style.visibility = visStr; }
        } else {
            if (visStr == 'show') visStr = 'visible';
            if (visStr == 'hide') visStr = 'hidden';
            if (theObj) theObj.style.visibility = visStr;
        }
    }
}

function findLag( navn ) {
    if (document.layers) return document.layers[navn];
    if ( document.all )  return document.all[navn];
    return document.getElementById(navn);
}; //end findLag( string )

function showLayer(n) {
  show_hide_layers( findLag(n), 'show' );
}

function hideAllLayers() {
  show_hide_layers( findLag('test1'),'hide', findLag('test2'),'hide', findLag('test3'),'hide', findLag('test4'),'hide' );
}


<div id="V-AC" style="position:absolute; left:425; top:230; width:150; height:25; z-index:1; background-color: #FFFFFF; layer-background-color: #FFFFFF; border: 1px none #000000; visibility: hidden">Fejl 1</div>

<div id="V-DC" style="position:absolute; left:425; top:230; width:150; height:25; z-index:1; background-color: #FFFFFF; layer-background-color: #FFFFFF; border: 1px none #000000; visibility: hidden">Fejl 2</div>

<div id="Ohm" style="position:absolute; left:425; top:230; width:150; height:25; z-index:1; background-color: #FFFFFF; layer-background-color: #FFFFFF; border: 1px none #000000; visibility: hidden">Fejl 3</div>

<div id="Cap" style="position:absolute; left:425; top:230; width:150; height:25; z-index:1; background-color: #FFFFFF; layer-background-color: #FFFFFF; border: 1px none #000000; visibility: hidden">Fejl 4</div>



<a href="java script:showLayer('test1')">Vis 1</a> |
<a href="java script:showLayer('test2')">Vis 2</a> |
<a href="java script:showLayer('test3')">Vis 3</a> |
<a href="java script:showLayer('test4')">Vis 4</a>

<br><br><br><br><br><br><br>

<a href="java script:hideAllLayers()">Nulstil</a><br />
Avatar billede roenving Novice
18. april 2007 - 02:01 #1
Avatar billede ssundsdal Nybegynder
18. april 2007 - 11:04 #2
Lukket.
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester