hover i bokse (CSS)

Er der en måde hvorpå man med 'hover' kan ændre background-color får en boks når man bevæger cursoren hen over boksen?

Takker på forhånd.

In the beginning, the Universe was created. This has made a lot of people angry and is widely regarded as a bad move.
--- The Hitchhiker's Guide To The Galaxy

Hvis din standardbaggrund er sort og du vil have den til at blive hvid ved mouseover, gør du flg.:

onMouseOver="this.style.background-color='white';" onMouseOut="this.style.background-color='black';"

Der er en fejl i det, A.L.P. skrev, der er ik noget css element som hedder backgroundColor ........

-- egern

Er der en måde hvorpå man med 'hover' kan ændre background-color får en boks når man bevæger cursoren hen over boksen?

Takker på forhånd.

Skriv dette stykke kode i <TD> koden:
Onmouseover="this.style.backgroundColor='denfarveduvilhave';" og Onmouseout="this.style.backgroundColor='standardfarve';"

HUSK AT AT KODEN SKAL SKRIVES SOM DET STÅR OVENOVER! UNDTAGEN "Denfarveduvilhave"
OG "Standardfarve"

<TD>? Jeg bruger ikke tables.

Hvad bruger du så??



Jeg bruger bare bokse. Jeg har en CSS-boks, og jeg ville gerne vide om man kunne gøre sådan at når man bevægede musen hen over boksen så skiftede den baggrundsfarve. Ikke noget med tables. Desuden har jeg prøvet at sætte min boks i et table og sætte koden (egerns kode) ind i <td> tag'et, men det virkede ikke.
Kunne du evt. poste et eksempel med fuld kode - jeg er ikke sikker på, at jeg forstå hvad du mener.

In the beginning, the Universe was created. This has made a lot of people angry and is widely regarded as a bad move.
--- The Hitchhiker's Guide To The Galaxy

Mit stykke kode virker! Prøv selv at besøge www.ournameclan.tk! Der er der tables...

Prøv at indsætte følgende kode i et nyt HTML dokument:

<Table Border="0" width="500" Height="500" Cellspacing="0" Cellpadding="0">
<TR Style="Height='50pt'">
<TD bgcolor="white" Bordercolor="red" Onmouseover="this.style.backgroundColor='blue';" Onmouseout="this.style.backgroundColor='white';">DETTE ER NOGET TEST TEKST</TD>
</TR>
</TABLE>



www.andreaslinks.tk - Company Site
www.ournameclan.tk - AA : O Clan site

Er der en måde hvorpå man med 'hover' kan ændre background-color får en boks når man bevæger cursoren hen over boksen?

Takker på forhånd.

In the beginning, the Universe was created. This has made a lot of people angry and is widely regarded as a bad move.
--- The Hitchhiker's Guide To The Galaxy

Lad os sige at du har en menu der ser sådan her ud i html kode:

<div class="menu-gruppe"
     Generelt
</div>
      <span class="menu-link"><a href="/">Forsiden</a></span>
      <span class="menu-link"><a href="/download/">Download</a></span>

Så kan din css kode se sådan her ud:

.menu-link a {
    color:#555555;
    background-color:#EEEEEE;
    text-decoration:none;
    width:100%;
    padding-left:10px;
    padding-right:10px;
}
.menu-link a:hover {
    color:#555555;
    background-color:#E8E8E8;
    text-decoration:none;
    width:100%;
    padding-left:10px;
    padding-right:10px;
}
.menu-link a:visited {
    color:#555555;
    background-color:#EEEEEE;
    text-decoration:none;
    width:100%;
    padding-left:10px;
    padding-right:10px;
}
.menu-link a:visited:hover {
    color:#555555;
    background-color:#E8E8E8;
    text-decoration:none;
    width:100%;
    padding-left:10px;
    padding-right:10px;
}

Det at "menu-link" i alle tilstande har sat width til 100% gør at det fylder alt pladsen ud. Dette virker desværre kun i IE (Har selv kun testet det på 6.0'eren men mon ikke 5.5 og 5.0 også vil godtage det?)

Mvh
Kaare

P.S. Kodestumperne er taget fra min egen side KHS SoftWare. Og jeg har også selv testet det i Mozilla 1.0 og Netscape 7.0 hvor det ikke virker. Altså hvor kun der hvor der er tekst bliver farvet.[Redigeret d. 05/10-02 09:44:39 af Kaare]

Den 03-10-02 20:31 skrev William Wallace følgende:
-----------------------------------------------------------------------------
Er der en måde hvorpå man med 'hover' kan ændre background-color får en boks når man bevæger cursoren hen over boksen?

Takker på forhånd.

In the beginning, the Universe was created. This has made a lot of people angry and is widely regarded as a bad move.
--- The Hitchhiker's Guide To The Galaxy
-----------------------------------------------------------------------------

Ja, det er der da, men det er en anelse avanceret. Det er display-egenskaben du skal kigge på. Der er a-tagget normalt et inline element og du kan ikke sætte en bredde eller højde på det. Ved at sætte display til block (display: block kan du få den ønskede effekt.

Et eks - Here goes:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
<title>CSS Display</title>
<style>

/*
A: Læg især mærke til display! Det er den der gør tricket.
*/
TD A {
font: bold 14px Verdana;
text-decoration: none;
color: white;
background-color: red;
display: block;
padding-top: 20px;
height: 50px;
width: 150px;
}

A:hover {background-color: navy;}

TD { text-align: center; }
</style>
</head>
<body>
<table>
<tr><td><a href="#">Link 1</a></td><td><a href="#">Link 2</a></td><td><a href="#">Link 3</a></td></tr>
<tr><td><a href="#">Link 4</a></td><td><a href="#">Link 5</a></td><td><a href="#">Link 6</a></td></tr>
</table>
<a href="mailto:markgray@tdcspace.dk">Mark Gray</a>
</body>
</html>

[Redigeret d. 18/10-02 22:22:21 af Mark Gray]

Jeg bruger bare bokse. Jeg har en CSS-boks

På en internetside kan man ikke "bare" have en boks. Man kan kun have HTMLkoder (og andre koder). Du bliver nødt til at gortælle hvad du mener med en CSS-boks. det kan være en <div> eller andre ting. Men hvad er din boks?

Er der en måde hvorpå man med 'hover' kan ændre background-color får en boks når man bevæger cursoren hen over boksen?

Takker på forhånd.

In the beginning, the Universe was created. This has made a lot of people angry and is widely regarded as a bad move.
--- The Hitchhiker's Guide To The Galaxy

Skriv dette stykke kode i <TD> koden:
Onmouseover="this.style.backgroundColor='denfarveduvilhave';" og Onmouseout="this.style.backgroundColor='standardfarve';"

HUSK AT AT KODEN SKAL SKRIVES SOM DET STÅR OVENOVER! UNDTAGEN "Denfarveduvilhave"
OG "Standardfarve"

www.andreaslinks.tk - Company Site
www.ournameclan.tk - AA : O Clan site[Redigeret d. 03/10-02 20:59:17 af A.L.P]

Er der en måde hvorpå man med 'hover' kan ændre background-color får en boks når man bevæger cursoren hen over boksen?

Takker på forhånd.

In the beginning, the Universe was created. This has made a lot of people angry and is widely regarded as a bad move.
--- The Hitchhiker's Guide To The Galaxy

Hvis din standardbaggrund er sort og du vil have den til at blive hvid ved mouseover, gør du flg.:

onMouseOver="this.style.background-color='white';" onMouseOut="this.style.background-color='black';"

Der er en fejl i det, A.L.P. skrev, der er ik noget css element som hedder backgroundColor ........

-- egern

Er det ikke JavaScript?

In the beginning, the Universe was created. This has made a lot of people angry and is widely regarded as a bad move.
--- The Hitchhiker's Guide To The Galaxy

Er der en måde hvorpå man med 'hover' kan ændre background-color får en boks når man bevæger cursoren hen over boksen?

Takker på forhånd.

In the beginning, the Universe was created. This has made a lot of people angry and is widely regarded as a bad move.
--- The Hitchhiker's Guide To The Galaxy

Skriv dette stykke kode i <TD> koden:
Onmouseover="this.style.backgroundColor='denfarveduvilhave';" og Onmouseout="this.style.backgroundColor='standardfarve';"

HUSK AT AT KODEN SKAL SKRIVES SOM DET STÅR OVENOVER! UNDTAGEN "Denfarveduvilhave"
OG "Standardfarve"

www.andreaslinks.tk - Company Site
www.ournameclan.tk - AA : O Clan site[Redigeret d. 03/10-02 20:59:17 af A.L.P]

<TD>? Jeg bruger ikke tables.

In the beginning, the Universe was created. This has made a lot of people angry and is widely regarded as a bad move.
--- The Hitchhiker's Guide To The Galaxy

Er der en måde hvorpå man med 'hover' kan ændre background-color får en boks når man bevæger cursoren hen over boksen?

Takker på forhånd.

In the beginning, the Universe was created. This has made a lot of people angry and is widely regarded as a bad move.
--- The Hitchhiker's Guide To The Galaxy

Skriv dette stykke kode i <TD> koden:
Onmouseover="this.style.backgroundColor='denfarveduvilhave';" og Onmouseout="this.style.backgroundColor='standardfarve';"

HUSK AT AT KODEN SKAL SKRIVES SOM DET STÅR OVENOVER! UNDTAGEN "Denfarveduvilhave"
OG "Standardfarve"

www.andreaslinks.tk - Company Site
www.ournameclan.tk - AA : O Clan site[Redigeret d. 03/10-02 20:59:17 af A.L.P]

<TD>? Jeg bruger ikke tables.

In the beginning, the Universe was created. This has made a lot of people angry and is widely regarded as a bad move.
--- The Hitchhiker's Guide To The Galaxy

Hvad bruger du så??

www.andreaslinks.tk - Company Site
www.ournameclan.tk - AA : O Clan site

Er der en måde hvorpå man med 'hover' kan ændre background-color får en boks når man bevæger cursoren hen over boksen?

Takker på forhånd.

Skriv dette stykke kode i <TD> koden:
Onmouseover="this.style.backgroundColor='denfarveduvilhave';" og Onmouseout="this.style.backgroundColor='standardfarve';"

HUSK AT AT KODEN SKAL SKRIVES SOM DET STÅR OVENOVER! UNDTAGEN "Denfarveduvilhave"
OG "Standardfarve"

<TD>? Jeg bruger ikke tables.

Hvad bruger du så??

Jeg bruger bare bokse. Jeg har en CSS-boks, og jeg ville gerne vide om man kunne gøre sådan at når man bevægede musen hen over boksen så skiftede den baggrundsfarve. Ikke noget med tables. Desuden har jeg prøvet at sætte min boks i et table og sætte koden (egerns kode) ind i <td> tag'et, men det virkede ikke.
Kunne du evt. poste et eksempel med fuld kode - jeg er ikke sikker på, at jeg forstå hvad du mener.

In the beginning, the Universe was created. This has made a lot of people angry and is widely regarded as a bad move.
--- The Hitchhiker's Guide To The Galaxy