06. april 2005 - 14:20Der er
60 kommentarer og 1 løsning
z-index og css menu
Hey, skal lige høre, hvad der er smartest at gøre.
Du har en css-lavet menu (dvs. med hover-effekter) Ved siden af denne menu skal være et billede, som kommer til at ligge ind over (foran) denne menu, - her skal jeg vel bruge css - z-index, Ik. Men når jeg gør det, så virker css-hoveren jo ganske klart ikke? Hvordan gør man så, når man vil lægge et billedet hen over noget andet unden at det påvirker hover-effekt på en menu?
du lægger billedet først eller sidst i body og giver det en klasse, fx "topimg". så skriver du i style .topimg { z-index: 2; position: absolute; top: 20px; left: 30px; }; body { z-index: 1; }; så ligger billedet 20px fra toppen og 30px fra siden
Jeg har fatte pointen... og kan se dit problem, jeg tror du bliver nødt til at lave små billeder, som du så udskifter.. Jeg kan prøve at kutte billederne, men så er der ikke så meget ved det ;)
tja, det kan du faktisk godt. Det går ud på, at når cursoren kommer over menuen, skal klassen ændres. jeg vil prøve at kigge på det... så jeg kan have et script klat, hurtigts muligt.
Men det må da være et kendt problem - - - så man må da kunne finde det et sted. (Det skal jo helst også virke i forskellige browsere (IE, Mozilla Firefox, Nescape, Opera.)
Så skifter du bare hvert enkelt billede, når der muses over. Jeg er desværre nødt til at gå, men jeg kommer igen om lidt over en time Så kan jeg får tænkt en løsning igennem...
Den menu, der ses her, skal have background: transparent, sådan at ridderen ses. Men vil også gerne have farvede menupunkter, derfor vil jeg bruge opacity i felterne. Er der en der kan lave koden. Kan ikke finde ud af det. Teksten i menuerne skal jo stadig være fuld sort, dvs. uden opacity.?
Grunden til, at din ikke virkede, var fordi opacity ikke virker offline. ?-)
Men har lige nogle ønsker: Hvad hvis jeg vil have at opacity ikke skal gælde, når på hover-effekten. + hvis den ikke skal gælde normalt i øverste og nederste menu-rum?
Der er ingen somhelst forskel på, om du tester online eller offline - opacity virker fint i begge situationer. Gør det ikke det, skyldes det andre ting :)
Ovenfor gælder opacity kun på hover. Hvis den også skal gælde på overksriften, så skal du tilføje den på .overskrift: .overskrift { background-color: #8F9CC6; color: #000000; border-top: 1px solid #D5DFFF; border-left: 1px solid #D5DFFF; border-bottom: 1px solid #393939; line-height: 20px; filter:Alpha(opacity=75); }
Du kan tilføje/fjerne/flytte opacity, som det passer dig...
Jeg kan slet ikke for opacity til at virke - måske du kunne lige hurtigt lave et valideret eksempel bare med en simpel table. Hvis det virker kan jeg jo arbejde udfra den?
Arhhh!.... Nu har jeg fundet ud af, hvorfor den ikke viste opacity. Du ved sikkert at der er pop-up blokker indbygget i windows - nu har jeg klikket på den aflange knap der kommer til syne øverst i billedet og tilladt activt indhold på siden - DOH. Jeg vil lige arbejde videre på det. :)
Hehe .. Det er en del af SP2 Iriterende, når man sidder og arbejder med noget, man selv har lavet. Men praktisk, når det er et "fjendtligt" website.. :)
Så nu virker det du skrev d. 07/04-2005 19:47:10. Lige et spgm. Hvordan får jeg opcity til IKKE at virke ved hover. Dvs. når musen føres over menupunkterne skal punkterne være fuldt synlige farver! ?
Er det mon ikke denne, der driller: Funktioner -> Internetindstillinger -> Avanceret -> Tillad aktivt indhold at køre i filer på Denne computer [næsten nederst i listen]
- den sidste bør have et flueben, hvis man bruger PC'en til webudvikling :)
Det hjælper nok at sige mit endelig ønske om menuen - så du kan lave en kode. Ved hover skal farverne være rene uden opacity. I øverste og nederste felt, som er lidt mindre end de andre skal der være et lille billede (med runde hjørner). >Olebole, ja det er den.
Jeg kan godt hjælpe, men kan ikke lave det før på fredag. er det ikke okay, så må vi jo håbe på, at der er en der ser dette før ;) Jeg syntes også at du skulle prøve at rode lidt med det.. Jeg er ikke helt med om du overhovedet vil bruge opacity, eller om du vil "rense" menuen for opacity, når det muses over.. dette gøres sådan: filter:Alpha(opacity=100); -moz-opacity:1; opacity:1;
Det er ikke muligt. Fordi teksten og dens bagrunden hænger sammen. Du kan ikke style sådan, så teksten står knivskarpt, og tekstens bagrund er halv-gennemsigtig..
Det må kunne lade sig gøre - det gør det i hvert fald, hvis man opbygger i divs. Skal jeg oprette et nyt spgm. med ønske om at få bygget selvsamme menu bare med knivskarp tekst - eller kan du lave det?
Jeg kan ikke.. Jeg tror stadig ikke det er muligt, før jeg ser et bevis.. :) Men du kan jo lægge et link til spm'et, så kan jeg lære det :) ...hvis det er muligt ;)
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.