CIO Tech Eksperten IT-JOB IT-Kurser Events Podcast Søg

Log ind eller opret profil

Du kan også logge ind via nedenstående tjenester

Slettet bruger

21. januar 2008 - 00:12 Der er 13 kommentarer

a:active giver mig hoved pine

Jeg har en fast hovedmenu og en dynamisk undermenu. Meningen er at man skal kunne se på et faneblad i toppen hvilke hovedmenu man
besøger - det virker bare ikke - nogen idé om hvad jeg gør galt? ~:]

style.css
#nav { position:absolute; bottom:0px; right:13px; width:100%; padding:0; margin:0; }
#nav ul { margin:0; padding:0; }
#nav ul li { float:right; list-style:none; padding:0; }
#nav ul li a { display:block; width:100px; padding:7px 0; margin:0 1px 0 0; background:url(../images/buttonbg.gif); text-align:center; }
#nav ul li a:hover { bottom:0; background:url(../images/buttonbgover.gif); color:#999999; overflow:auto; }
#nav ul li a:active { width:100px; padding:7px 0; background:url(../images/buttonbgon.gif); text-align:center; }

index.php
<div id="nav">
<ul>
<li><a href="index.php?id=6&mainid=6">Side 6</a></li>
<li><a href="index.php?id=5&mainid=5">Side 5</a></li>
<li><a href="index.php?id=4&mainid=4">Side 4</a></li>
<li><a href="index.php?id=3&mainid=3">Side 3</a></li>
<li><a href="index.php?id=2&mainid=2">Side 2</a></li>
<li><a href="index.php?id=1&mainid=1">Forside</a></li>
</ul>
</div>

Synes godt om

olebole Juniormester

21. januar 2008 - 00:34 #1

<ole>

Det må du scripte dig ud af. Active betyder blot "mens musen er nede på linket".

"The :active pseudo-class applies while an element is being activated by the user. For example, between the times the user presses the mouse button and releases it."
http://www.w3.org/TR/CSS21/selector.html#x35

/mvh
</bole>

Synes godt om

olebole Juniormester

21. januar 2008 - 00:37 #2

På serveren indsætter du et span i menuen ved den aktuelle side - derefter er det bare at style span'et:

<ul>
<li><a href="index.php?id=6&mainid=6">Side 6</a></li>
<li><a href="index.php?id=5&mainid=5">Side 5</a></li>
<li><span>Side 4</span></li>
<li><a href="index.php?id=3&mainid=3">Side 3</a></li>
<li><a href="index.php?id=2&mainid=2">Side 2</a></li>
<li><a href="index.php?id=1&mainid=1">Forside</a></li>
</ul>

- der er jo ikke grund til, der er link til side 4, når du i forvejen står på den ;o)

Synes godt om

sibbelone Nybegynder

21. januar 2008 - 06:42 #3

http://www.cssplay.co.uk/menus/drop_examples.html

Synes godt om

Slettet bruger

21. januar 2008 - 16:42 #4

Selvom jeg er på side 4 skal der stadig være et link til den - derfor fanebladet i toppen der indikere hvilken hovedmenu man besøger! Nøjagtigt som hovedmenuen i sibelones link http://www.cssplay.co.uk/menus/drop_examples.html - siden er ok, men jeg skal ikke lave drop_examples... ~:]

Synes godt om

olebole Juniormester

21. januar 2008 - 17:46 #5

Fanbladet skal være der, men hvorfor skal der dog være et aktivt link til det faneblad, du står på i forvejen? Hvis du insisterer, så kan du sætte en klasse på linket:

<ul>
<li><a href="index.php?id=6&mainid=6">Side 6</a></li>
<li><a href="index.php?id=5&mainid=5">Side 5</a></li>
<li><a class="activeItem" href="index.php?id=4&mainid=4">Side 4</a></li>
<li><a href="index.php?id=3&mainid=3">Side 3</a></li>
<li><a href="index.php?id=2&mainid=2">Side 2</a></li>
<li><a href="index.php?id=1&mainid=1">Forside</a></li>
</ul>

Synes godt om

Slettet bruger

21. januar 2008 - 18:31 #6

Ja - ok nu fattede jeg det - selvfølgelig behøber linket ikke at være der, så længe fanebladet er der - men kan nogen vise mig koden, både i .php og .css filrn

Synes godt om

olebole Juniormester

21. januar 2008 - 19:26 #7

Hvis du bruger et span, kunne du skrive:

#nav { position:absolute; bottom:0px; right:13px; width:100%; padding:0; margin:0; }
#nav ul { margin:0; padding:0; }
#nav ul li { float:right; list-style:none; padding:0; }
#nav ul li a, #nav ul li span { display:block; width:100px; padding:7px 0; margin:0 1px 0 0; background:url(../images/buttonbg.gif); text-align:center; }
#nav ul li a:hover { bottom:0; background:url(../images/buttonbgover.gif); color:#999999; overflow:auto; }
#nav ul li a:active, #nav ul li span { width:100px; padding:7px 0; background:url(../images/buttonbgon.gif); text-align:center; }
#nav ul li span {cursor: default}

Hvordan PHP-koden skal se ud, kommer helt anpå, hvad du gør nu - men det må være noget med en if-sætning, der kikker på $_GET["id"] og skriver et link eller et span ud alt efter værdien :)

Synes godt om

Slettet bruger

26. januar 2008 - 16:01 #8

Jeg forstår ikke rigtig dét med <span> - jeg linker jo ikke til andre sider men til forskelligt indhold på samme side...

<div id="nav">
<ul>
<li><a href="index.php?id=6&mainid=6">Side 6</a></li>
<li><a href="index.php?id=5&mainid=5">Side 5</a></li>
<li><a href="index.php?id=4&mainid=4">Side 4</a></li>
<li><a href="index.php?id=3&mainid=3">Side 3</a></li>
<li><a href="index.php?id=2&mainid=2">Side 2</a></li>
<li><a href="index.php?id=1&mainid=1">Side 1</a></li>
</ul>
</div>

Synes godt om

olebole Juniormester

26. januar 2008 - 16:35 #9

Jeg forstår ikke, hvad det er, du ikke forstår. Jo, du linker for så vidt til forskellige sider - selvom det er det samme dokument med forskelligt indhold ... men det har i øvrigt intet at sige i forhold til brug af span eller ej :)

Synes godt om

Slettet bruger

26. januar 2008 - 16:40 #10

Jo - men skal jeg fjerne linket, eller har jeg totalt misforstået det?

<ul>
<li><a href="index.php?id=6&mainid=6">Side 6</a></li>
<li><a href="index.php?id=5&mainid=5">Side 5</a></li>
<li><span>Side 4</span></li> <---------
<li><a href="index.php?id=3&mainid=3">Side 3</a></li>
<li><a href="index.php?id=2&mainid=2">Side 2</a></li>
<li><a href="index.php?id=1&mainid=1">Side 1</a></li>
</ul>

Synes godt om

olebole Juniormester

26. januar 2008 - 17:10 #11

Ja, når brugeren har kaldt dette link:
index.php?id=4&mainid=4

- er der jo strengt taget ingen grund til at have et link, der blot reloader siden med det samme indhold :)

Synes godt om

Slettet bruger

26. januar 2008 - 18:43 #12

Så opnåede jeg dét jeg ville vha lidt javascript jeg fandt her på siden og et ekstra #activelink i css'en...

However! - hvis eg klikker en undermenu forsvinder markeringen i hovedmenuen og det synes jeg er lidt træls - kan det ændres?

.css
#nav ul li #activelink { width:100px; padding:7px 0; background:url(../images/buttonbgon.gif); text-align:center; }

JavaScript
if(window.addEventListener)window.addEventListener("load", function(){wload();}, false);
else if(window.attachEvent)window.attachEvent("onload", function(){wload();});

function wload(){
var links=document.getElementById("nav").getElementsByTagName("a");
for(i=0,i2=links.length;i<i2;i++){
if(links[i].href==window.location.href||links[i].href.replace("index.php","")==window.location.href){
links[i].setAttribute("id","activelink");
i=i2;
}
}
}

Synes godt om

olebole Juniormester

26. januar 2008 - 19:45 #13

Ja, hvis man insisterer på at krydse Nilen efter et halvt snapseglas vand, så kan man da også gøres med JavaScript ... men hvorfor dog?

Synes godt om

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.

Følg dette spørgsmål

Opret Preview

Webudvikling kurser

Vi tilbyder markedets bedste kurser inden for webudvikling

Se alle Webudvikling kurser

Flere spørgsmål fra HTML kategorien

Titel	Indlæg	Oprettet	Seneste aktivitet
Bredde på div elementer Af dane022 i HTML	2	16/02/202408:29	20/02/202412:50
Hvilken mindste mobilstørrelse til hjemmeside Af CSharpRazor i HTML	2	21/12/202322:51	22/12/202308:03
validering <input tlfnr. Af slein55 i HTML	5	15/10/202311:43	15/10/202314:51
Link fra form input Af jnrmgs i HTML	9	19/09/202319:10	23/09/202313:11
includere i HTML Af slein55 i HTML	3	15/09/202313:47	16/09/202309:40

Se alle spørgsmål i kategorien Opret spørgsmål

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

Alle kategorier på Eksperten

Seneste artiklerRSS