Notifikationer

Markér alle som læst Log ud

rusen Nybegynder

26. maj 2004 - 10:38 Der er 11 kommentarer og
2 løsninger

billedskift i css??

Hej alle c,")

Jeg er ved at strikke en side sammen, og er nu nået til menuen, som er en top menu, jeg ville lige høre om der er nogen som ved hvordan, hvis man kan, man bruger swap image ligesom i js.
Altså jeg skal have sådan at den skifter billed i en mouseover. er dette muligt i css, og hvis ja hvordan?

/RuSeN

Synes godt om

werd Nybegynder

26. maj 2004 - 10:47 #1

det kan du godt - du skal bare bruge: background-image:url(billede.jpg); i
a:link.menu og et nyt billede i a:hover.menu

Synes godt om

notes2c Nybegynder

26. maj 2004 - 10:47 #2

a {background: url(img1.gif);}
a:hover {background: url(img2.gif);}

Synes godt om

rusen Nybegynder

26. maj 2004 - 10:52 #3

ohh kigger lige på det

til om fem min

Synes godt om

rusen Nybegynder

26. maj 2004 - 10:54 #4

me der er jo flere billeder end et, der er omkring 8

Synes godt om

rusen Nybegynder

26. maj 2004 - 10:56 #5

jeg har oprettet forskellige classes til mine menu punkter, og det skal ske for hvert enkelt af dem

Synes godt om

notes2c Nybegynder

26. maj 2004 - 11:02 #6

a.menu1 {background: url(img11.gif);}
a.menu1:hover {background: url(img12.gif);}

a.menu2 {background: url(img21.gif);}
a.menu2:hover {background: url(img22.gif);}

a.menu3 {background: url(img31.gif);}
a.menu3:hover {background: url(img32.gif);}

o.s.v.

Synes godt om

rusen Nybegynder

26. maj 2004 - 11:04 #7

angiver jeg så de a menuer under hver class

Synes godt om

notes2c Nybegynder

26. maj 2004 - 11:34 #8

Synes godt om

rusen Nybegynder

26. maj 2004 - 11:59 #9

jeg kan ikke rigtig få det til at virke

Synes godt om

notes2c Nybegynder

26. maj 2004 - 12:09 #10

Hvordan ser din kode ud

Synes godt om

rusen Nybegynder

26. maj 2004 - 12:51 #11

index fil:
<html>
<head>
<title>.::Intelli.dk::.</title>
<link rel="stylesheet" style="type/css" href="style.css" />
</head>
<body bgcolor="#7d7d7d">
<center>
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td class="top" colspan="9"></td>
</tr>
<tr>
<td class="topm_01"></td>
<td class='topm_02'></td>
<td class="topm_03"></td>
<td class="topm_04"></td>
<td class="topm_05"></td>
<td class="topm_06"></td>
<td class="topm_07"></td>
<td class="topm_08"></td>
<td class="topm_09"></td>
</tr>
<tr>
<td colspan="9" class="main"></td>
</tr>
</table>
</center>
</body>
</Html>

css fil:
.top{
background-image: url(Interface GFX/top.jpg);
width: 768px;
height: 101px;
background-repeat: no-repeat;
}
.topm_01{
background-image: url(Interface GFX/topm_01.jpg);
width: 76px;
height: 22px;
background-repeat: no-repeat;
}
.topm_02{
background-image: url(Interface GFX/topm_02.jpg);
width: 101px;
height: 22px;
background-repeat: no-repeat;
}
.topm_03{
background-image: url(Interface GFX/topm_03.jpg);
width: 101px;
height: 22px;
background-repeat: no-repeat;
}
.topm_04{
background-image: url(Interface GFX/topm_04.jpg);
width: 76px;
height: 22px;
background-repeat: no-repeat;
}
.topm_05{
background-image: url(Interface GFX/topm_05.jpg);
width: 66px;
height: 22px;
background-repeat: no-repeat;
}
.topm_06{
background-image: url(Interface GFX/topm_06.jpg);
width: 100px;
height: 22px;
background-repeat: no-repeat;
}
.topm_07{
background-image: url(Interface GFX/topm_07.jpg);
width: 57px;
height: 22px;
background-repeat: no-repeat;
}
.topm_08{
background-image: url(Interface GFX/topm_08.jpg);
width: 100px;
height: 22px;
background-repeat: no-repeat;
}
.topm_09{
background-image: url(Interface GFX/topm_09.jpg);
width: 91px;
height: 22px;
background-repeat: no-repeat;
}
.main{
background-image: url(Interface GFX/main.jpg);
width: 768px;
height: 479px;
background-repeat: no-repeat;
}

Synes godt om

notes2c Nybegynder

26. maj 2004 - 13:10 #12

Den kode som jeg har givet forslag på er baseret på et a tag, du har sat class på et td tag. Problemet er at :hover kun understøttes på a tags i IE. Du mangler også at angive en :hover definition.

Prøv at kigge her: http://www.meyerweb.com/eric/css/edge/popups/demo2.html

Det er måske ikke 100% det du ønsker men iden kan bruges

Synes godt om

rusen Nybegynder

26. maj 2004 - 17:44 #13

ja ok, jeg kan forstå det ikke rigtig kan lade sige gøre, med classes som i mit eks. men kun med 'a' tags.
Jeg laver det i java istedet, men det kunne have været fedt i css.
Men tak for hjælpen

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
Hjælp med HTML og CSS Af Nojsa i HTML	18	10/09/202515:07	17/09/202515:11
CSS 2 x firkanter + tekst på samme linje Af nemlig i HTML	3	19/03/202522:16	20/03/202513:04
Se og ændre html på en webside Af magger i HTML	4	11/03/202513:55	12/03/202506:56
Få input felt, der er med fed skrift og formatteres på linje Af KurtG i HTML	5	02/03/202520:05	04/03/202515:40
Variabler som ikke virker Af Frits Jensen i HTML	3	30/10/202409:37	01/01/202515:27

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