Avatar billede para7 Nybegynder
17. februar 2006 - 17:38 Der er 6 kommentarer og
1 løsning

Simpel menu der husker valg

Kan nogen opstille et simpelt script til et par menupunkter, som jeg kan arbejde vidre med og tilføje flere links.

Altså en tekstbaseretmenu, hvor når man vælger et menupunkt, valget huskes og highlighte med en simpel style eller class -ændring til hvid, indtil man trykker på et andet link, der så over tager den hvide farve.

Kunne det være noget med onclick="style='color:white'" og så skal de andre link blive sorte igen?
Avatar billede olebole Juniormester
17. februar 2006 - 17:52 #1
<ole>

Hvis det er en menu, der udskiftes med siden, er det ikke måden at gøre det på. Der undlader du blot at sætte et link omkring teksten, der ellers linker til siden selv - og styler du den i stedet:

Sådan kunne forsidens menu se ud:
    <span class="actLink">Forsiden</span> | <a href="products.html">Produkter</a> | <a href="about.html">Om os</a> | <a href="contact.html">Kontakt</a>

- sådan ville menuen på 'about.html' se ud:
    <a href="index.html">Forsiden</a> | <a href="products.html">Produkter</a> | <span class="actLink">Om os</span> | <a href="contact.html">Kontakt</a>

- og så definerer du bare, hvordan klassen 'actLink' skal se ud i dit stylesheet - og det samme med dine links

/mvh
</bole>
Avatar billede para7 Nybegynder
17. februar 2006 - 18:52 #2
Tak, men jeg glemte at fortælle, at det er en menu i et rammesæt. Jeg kunne lave det i ASP, men så kan den der skal have det ikke køre det lokalt.

Altså, så er menuen kun een side, lad os kalde den menu.htm og putte js script i den. Jeg kan ikke komme ret langt med js :)

<base target="indholdsframe">
<a href="Forside.htm" onclick="style='color:white'">Forsiden</a>
<a href="Produkter.htm" onclick="style='color:white'">Produkter</a>
<a href="KontaktOs.htm" onclick="style='color:white'">KontaktOs</a>
Avatar billede olebole Juniormester
17. februar 2006 - 19:47 #3
Du kunne skrive noget à la:

<style type="text/css">
#menuCont a {
    font-weight: bold;
    background-color: blue;
    color: white;
    text-decoration: none;
}
#menuCont a:hover {
    background-color: lightblue;
    color: #000080;
    text-decoration: underline;
}
</style>

<script type="text/JavaScript">
var oActLink = null;
var oActStyles = {
    backgroundColor: "red",
    color: "yellow",
    textDecoration: "none"
};
function activateLink(oElm) {
    if (oActLink) for (x in oActStyles) oActLink.style[x] = "";
    for (x in oActStyles) oElm.style[x] = oActStyles[x];
    oActLink = oElm;
}
</script>

<div id="menuCont">
    <a href="Forside.htm" onclick="activateLink(this)">Forsiden</a>
    <a href="Produkter.htm" onclick="activateLink(this)">Produkter</a>
    <a href="KontaktOs.htm" onclick="activateLink(this)">KontaktOs</a>
</div>
Avatar billede para7 Nybegynder
18. februar 2006 - 11:08 #4
Genialt nok ;) Tak olebole. Det er billigt sluppet. Læg lige et svar.
Avatar billede para7 Nybegynder
19. februar 2006 - 15:15 #5
Læg lige et svar for point olebole...
Avatar billede para7 Nybegynder
24. februar 2006 - 10:17 #6
Nu lukker jeg altså snart..
Avatar billede para7 Nybegynder
02. marts 2006 - 09:47 #7
Lukket og tak.
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