Avatar billede dotcom1 Nybegynder
25. februar 2011 - 14:30 Der er 12 kommentarer og
1 løsning

CSS3 linear gradient syntaks hjælp

Hej.

Jeg vil gerne lave en lineær gradient med CSS3, men syntaksen driller. Den skal gå fra top til bund, og graduere fra transparent til #eee. Her er hvad jeg har:

background: transparent; /* for non-css3 browsers */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ffffff', endColorstr='#ffeeeeee'); /* for IE */
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255, 255, 255, 0)), to(rgba(238, 238, 238, 1.0))); /* for webkit browsers */
background: -moz-linear-gradient(rgba(255, 255, 255, 0) 0%, rgba(238, 238, 238, 1.0) 100%); /* for firefox 3.6+ */


Jeg får en masse parse og syntaks fejl.
Kan nogen hjælpe?
Avatar billede majbom Novice
25. februar 2011 - 17:50 #1
skriver du det bare såden uden videre?

du skal have det ind i et par tuborg'er og definere hvilket element det skal gælde for:

body{
  background: transparent; /* for non-css3 browsers */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ffffff', endColorstr='#ffeeeeee'); /* for IE */
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255, 255, 255, 0)), to(rgba(238, 238, 238, 1.0))); /* for webkit browsers */
  background: -moz-linear-gradient(rgba(255, 255, 255, 0) 0%, rgba(238, 238, 238, 1.0) 100%); /* for firefox 3.6+ */
}
Avatar billede dotcom1 Nybegynder
28. februar 2011 - 09:29 #2
Hej.

Ja ok, det er jeg godt klar over. Har det i mit stylesheet, hvor det gælder for den div:

#mydiv {
  background: transparent; /* for non-css3 browsers */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ffffff', endColorstr='#ffeeeeee'); /* for IE */
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255, 255, 255, 0)), to(rgba(238, 238, 238, 1.0))); /* for webkit browsers */
  background: -moz-linear-gradient(rgba(255, 255, 255, 0) 0%, rgba(238, 238, 238, 1.0) 100%); /* for firefox 3.6+ */
}

- Det er mere syntaksen (med alpha transparency) jeg er i tvivl om... :)
Avatar billede majbom Novice
01. marts 2011 - 21:26 #3
jeg har leget lidt med det her: http://majbom.com/testarea/exp/932590/
Avatar billede olebole Juniormester
02. marts 2011 - 17:30 #4
<ole>

Der er ikke vist noget i den viste syntaks, der bør udløse parse- eller syntaksfejl. Prøv at lægge et link  =)

Derudover bør et HTML element have 'layout', hvis et filter skal virke i IE:
    http://msdn.microsoft.com/en-us/library/ms533776(v=vs.85).aspx

/mvh
</bole>
Avatar billede olebole Juniormester
02. marts 2011 - 17:36 #5
- og da du specifikt spørger om syntaksen i CSS3, så er der lidt eksempler her:
    http://dev.w3.org/csswg/css3-images/#linear-gradient-examples
Avatar billede dotcom1 Nybegynder
03. marts 2011 - 12:06 #6
Super, tak for jeres hjælp. Jeg vil gerne af med points - lægger I ikke begge et svar?
Avatar billede majbom Novice
03. marts 2011 - 12:34 #7
selv tak :)
Avatar billede olebole Juniormester
03. marts 2011 - 15:39 #8
Jeg springer over. Jeg kommer her næsten aldig mere, men sad lige og kedede mig. Giv dem til splazz - men tak for tilbudet  ;o)
Avatar billede dotcom1 Nybegynder
04. marts 2011 - 12:34 #9
Helt okay.
Tak og selvtak.
Avatar billede majbom Novice
04. marts 2011 - 17:09 #10
tfp :)

må man spørge ole, om det er tiden eller lysten der mangler?
Avatar billede olebole Juniormester
04. marts 2011 - 17:57 #11
Det er primært tiden, det har knebet med. På den anden side blev jeg aktiv på Eksperten tilbage i 1999, og så har man set de fleste spørgsmål mange gange før - og svaret på dem ligeså mange gange.

Samtidig havde jeg fornemmelsen af, at der blev længere og længere mellem de teknisk udfordrende spørgsmål - men det kan sagtens hænge sammen med de mange år og tusinder af tråde.

Anyway, så er der kun 25 timer i døgnet (hvis man sløjfer frokostpausen), så der skal jo af og til prioriteres. I den proces gled E mere og mere i baggrunden. Ikke som en bevidst handling ... bare sådan en helt autonom udvikling. Jeg fortryder ikke et sekund på E og anbefaler stadig lystigt andre at søge hjælp og viden her  =)
Avatar billede majbom Novice
04. marts 2011 - 18:05 #12
okay, ja det er osse længe du har været her så - kan allerede se at her efter et par år hvor jeg har været mere hjælpende end spørgende, dukker der dubletter op jævnligt :)

men jeg vil da kun håbe på at du stadig kigger forbi i ny og næ, det er sq rart at der er nogle her der virkelig ved hvad de snakker om, og det er bestemt mit indtryk af dig (og sikkert også de fleste andre herinde :))

nu skal jeg ikke bruge spørgers tråd mere - undskyld for OT!
Avatar billede olebole Juniormester
05. marts 2011 - 17:00 #13
Tak, vi ses nok af og til  =)
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
Vi tilbyder markedets bedste kurser inden for webudvikling

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