Søg
Avatar billede mikmakmuk Nybegynder
08. maj 2002 - 08:09 Der er 27 kommentarer og
1 løsning

Markering af aktiv link

Hej allesammen

Jeg sidder og roder med noget navigation på en side med rammer. Jeg har en liste med links i venstre side. Jeg vil gerne opnå den effekt at den sidste link man har klikket på forbliver markeret til man klikker på en anden i samme ramme og kun der. Jeg har prøvet at få det til at virke via CSS, uden held.
Avatar billede teamdev Novice
08. maj 2002 - 08:13 #1
Hmm I CSS burde det da virke med f.eks. a:active {font-style: bold}
Avatar billede mikmakmuk Nybegynder
08. maj 2002 - 08:22 #2
Det er det jeg allerede har gjort. Problemet er at når man klikker i en anden ramme så forsvinder markeringen
Avatar billede mikmakmuk Nybegynder
08. maj 2002 - 08:25 #3
Skal jeg i virkeligheden holde mig langt væk fra frames
Avatar billede teamdev Novice
08. maj 2002 - 08:29 #4
Det er fordi du bruger frames. Når du klikker i den anden frame er linket jo ikke aktivt mere hvis du forstår.....

Jeg bryder mig personligt ikke alt for meget om frames, men det er vel en smagssag
Avatar billede bamzen Nybegynder
08. maj 2002 - 08:38 #5
a:active er kun i det øjeblik du trykker musen ned på linket
Avatar billede mikmakmuk Nybegynder
08. maj 2002 - 08:39 #6
Det forstår jeg fuldt ud, men er der en vej uden om det ?
Avatar billede mikmakmuk Nybegynder
08. maj 2002 - 09:04 #7
Eller det kan man måske ikke?
Avatar billede jakoba Nybegynder
08. maj 2002 - 09:06 #8
prøv evt at lege videre med denne:

<HTML>
<HEAD><TITLE>Javascript styling af link</TITLE>

<script type='text/javascript'>
var valgtFarve = 'red';
var offFarve = 'blue';
var lastLinkStyle = null;
function doOnclick( stil ) {
    if ( stil != lastLinkStyle ) {
        if ( lastLinkStyle ) {
            lastLinkStyle.color = offFarve;
        }
        stil.color = valgtFarve;
        lastLinkStyle = stil;
    }
}; //end doOnclick( Style object )
</script>

<style type='text/css'>
a    {      color:blue;    font-size:15pt; }
a:link    { font-decoration: underline;          background-color:#CCFFFF; }
a:visited { font-decoration: none;              background-color:#CCCCCC; }
a:active  { font-decoration: underline overline; background-color:#FFCCFF; }
a:hover  { font-decoration: underline overline; background-color:#FFFFCC; }
</style>

</HEAD>
<BODY>

<a href="java script:void(1);" onclick="doOnclick(this.style)">nowhere 1</a><br>
<a href="java script:void(2);" onclick="doOnclick(this.style)">nowhere 2</a><br>
<a href="java script:void(3);" onclick="doOnclick(this.style)">nowhere 3</a><br>
<a href="java script:void(4);" onclick="doOnclick(this.style)">nowhere 4</a><br>

</BODY>
</HTML>

bemær at den styleattribut der ænsres ikke kan være defineret som en a:<situation> style. den skal være defineret konstant for den link klasse.

mvh JakobA
Avatar billede mikmakmuk Nybegynder
08. maj 2002 - 09:09 #9
tak for det.
Avatar billede mikmakmuk Nybegynder
08. maj 2002 - 09:19 #10
præcis hvad jeg gerne ville have
Avatar billede mikmakmuk Nybegynder
08. maj 2002 - 09:56 #11
hmmm.
<a href="java script:void(http://etellerandet);" onclick="doOnclick(this.style)">link 1</a><br>
<a href="java script:void(http://etellerandetandet);" onclick="doOnclick(this.style)">link 1</a><br>

Det virker fint når man klikker på den første link, men når man klikker på den næste får jeg at vide at siden ikke kan vises
Avatar billede jakoba Nybegynder
08. maj 2002 - 09:59 #12
Ups. din href skal bare være normal. jeg skrev 'java script:void(...)' netop for at undgå at siden hoppede nogen vegne.

<a href="http://etellerandet" target="dinandenramme" onclick="doOnclick(this.style)">link 1</a><br>

mvh JakobA
Avatar billede mikmakmuk Nybegynder
08. maj 2002 - 10:00 #13
<html>

<head>
<link rel="stylesheet" type="text/css" href="../style/styles.css">
<script type='text/javascript'>

var valgtFarve = '#00ff00';
var offFarve = '#004000';
var lastLinkStyle = null;

function doOnclick( stil )
{
    if ( stil != lastLinkStyle ) {
        if ( lastLinkStyle ) {
            lastLinkStyle.color = offFarve;
        }
        stil.color = valgtFarve;
        lastLinkStyle = stil;
    }
}; //end doOnclick( Style object )

</script>
</head>

<body>

<p align='left'>

<a href="java script:void(location.href='http://www.jubii.dk');" target='content' onclick="doOnclick(this.style)">Jubii</a>
<br>
<a href="java script:void(location.href='http://www.yahoo.com');" target='content' onclick="doOnclick(this.style)">Yahoo</a>
</p>
</body>
</html>
Avatar billede mikmakmuk Nybegynder
08. maj 2002 - 10:02 #14
skulle det ikke være fint nok
Avatar billede jakoba Nybegynder
08. maj 2002 - 10:05 #15
jeg ville nok skrive de to links som:

<a href="http://www.jubii.dk" target='content' onclick="doOnclick(this.style)">Jubii</a><br>
<a href="http://www.yahoo.com" target='content' onclick="doOnclick(this.style)">Yahoo</a>

mvh www.fotx.net/jakoba
Avatar billede mikmakmuk Nybegynder
08. maj 2002 - 10:07 #16
java script:void(location.href='index/etellerandet.html');

Må jeg ikke lave den relativ, eller skal jeg skrive den fuldstændige URL
Avatar billede jakoba Nybegynder
08. maj 2002 - 10:12 #17
jo den må også gerne være relativ. Det er et helt almindeligt link bortset fra den der onclick handeler.
Avatar billede mikmakmuk Nybegynder
08. maj 2002 - 10:48 #18
Når jeg klikker på linken bliver den bold, men når jeg så klikker i en anden frame bliver den plain. Kan jeg få valgtfarve til at være bold?
Avatar billede mikmakmuk Nybegynder
08. maj 2002 - 10:56 #19
Jeg er vist en værre spørgeJørgen *LOL*
Avatar billede jakoba Nybegynder
08. maj 2002 - 11:03 #20
du kan udvide med alle de style attributter du vil.

<script type='text/javascript'>

var valgtFarve = '#00ff00';
var valgtFedhed = '900'; // ret så fed
var offFarve = '#004000';
var offFedhed = '300';  // decideret tynd
var lastLinkStyle = null;

function doOnclick( stil )
{
    if ( stil != lastLinkStyle ) {
        if ( lastLinkStyle ) {
            lastLinkStyle.color = offFarve;
            lastLinkStyle.fontWeight = offFedhed;
        }
        stil.color = valgtFarve;
        stil.fontWeight = valgtFedhed;
        lastLinkStyle = stil;
    }
}; //end doOnclick( Style object )

</script>

PS: jeg er ikke 100% på at fontWeight er det korrekte javascript navn for den style attibut.

kommer igen om nogen timer, skal til møde.

mvh JakobA
Avatar billede mikmakmuk Nybegynder
08. maj 2002 - 14:25 #21
Det virker smadder godt
Avatar billede mikmakmuk Nybegynder
08. maj 2002 - 14:26 #22
Men hvorfor kan jeg ikke ændre baggrundsfarven på en knap
Avatar billede mikmakmuk Nybegynder
08. maj 2002 - 14:27 #23
mit gæt er

<script type='text/javascript'>

var valgtFarve = '#abcd00';
var valgtFedhed = 600;
var vbg = '#000000';

var offFarve = '#ffffff';
var offFedhed = 600;
var offbg = '#ffffff';

var lastLinkStyle = null;

function doOnclick( stil )
{
    if ( stil != lastLinkStyle ) {
        if ( lastLinkStyle ) {
            lastLinkStyle.color = offFarve;
            lastLinkStyle.fontWeight = offFedhed;
            backgroundColor = vbg;
        }
        stil.color = valgtFarve;
        stil.fontWeight = valgtFedhed;
        stil.backgroundColor = offbg;
       
        lastLinkStyle = stil;
    }
}; //end doOnclick( Style object )

</script>
Avatar billede mikmakmuk Nybegynder
08. maj 2002 - 15:08 #24
lastLinkStyle.backgroundColor = vbg;

men det var ikke det som var galt
Avatar billede jakoba Nybegynder
08. maj 2002 - 15:12 #25
Jeg ved det ikke, men der var et andet spørgsmål idag eller igår om netop det.
Noget med at det kunne IE6 ikke altid hitte ud af, (IE5.5 og NS6 kunne godt).

Så his du bruger IE6 til test var det spm nok værd at finde.

du kunne evt prøve at sætte bpde backgroundColor og background

        stil.color = valgtFarve;
        stil.fontWeight = valgtFedhed;
        stil.backgroundColor = offbg;
        stil.background = offbg;

Øhh... hvad med at bruge navngivningsreglerne så det er valgtbg (eller i det nindste vbg) for den valgte knap?

mvh JakobA
Avatar billede mikmakmuk Nybegynder
08. maj 2002 - 15:21 #26
Jeg tester med IE6
Avatar billede mikmakmuk Nybegynder
08. maj 2002 - 15:27 #27
Nu mangler jeg bare at finde ud af hvordan jeg lave stil.background om til et billede
Avatar billede mikmakmuk Nybegynder
08. maj 2002 - 15:53 #28
Jeg har fundet ud af det :-)
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
Webudvikling kurser
Vi tilbyder markedets bedste kurser inden for webudvikling
Se alle Webudvikling kurser

Flere spørgsmål fra JavaScript kategorien

Titel Indlæg Oprettet Seneste aktivitet
problem med download i <a href=" " download> tag i JavaScript Af Peer i JavaScript 5 27/04/202620:09 21/08/202610:41
Validering af filnavn i formular Af Strawberry i JavaScript 8 14/04/202610:11 20/04/202611:14
Mangler et JavaScript til htm side med iframe i Joomla5 Af Peder Lund Nielsen i JavaScript 2 03/02/202614:19 04/04/202616:02
Åbne en PDF fil fra en mappe Af mbl i JavaScript 9 18/04/202516:52 22/04/202512:33
Spørgsmål til cookies Af Mads i JavaScript 2 14/02/202511:47 27/06/202514:34
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.

Opret Log ind

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten
Seneste spørgsmål Seneste aktivitet
18/0919:52 Libre office skriveprogram Af Frank i Office & Kontorpakker
17/0914:55 Hente WordPad til Windows 11 Af Strawberry i Andet software
17/0911:37 Persits.Upload Af bsn i ASP
16/0918:13 oprette et installationsmedie Af Malm i Windows
16/0913:11 Adapterstik stik på ladekabel til USB-C Af ErikHg i Andet software
White papers
Flere white papers »