Gradering som bakgrunn?

[cookiefi]

Hei, jeg har en side der jeg skulle ha hatt bakgrunnen gradert.

Er det mulig jeg bruker css. Så jeg tenkte at jeg skulle ta en linje på 1 pixel som gjentokk seg ned over hele siden.

 

Men problemet da er at jeg ikke vet hvor lang den skal være for og dekke hele siden?

Er det noen som har en smart løsning på dette?

Endret 21. september 2006 av cookiefi

[Mads-b]

Hvis linjen din er vannrett, er det vel bare å repetere den nedover uendelig?

background:url(noe) repeat-y;

[cookiefi]

Hvis linjen din er vannrett, er det vel bare å repetere den nedover uendelig?

background:url(noe) repeat-y;

6910261[/snapback]

 

Men hvor lang skal den være bort over? Altså horisontalt?

Siden den skal dekke hele siden!

[funkyboy]

Dersom du skal lage en gradering som går bortover, er det lurt av deg å teste designet på både 800 x 600- skjerm (sjelden folk bruker mindre), 1024x 768, og oppover for å se om det fungerer like bra. En ting som kan være greit, er å bruke bakgrunnsfarge på siden, og at graderingen går ut i denne. Eksempelvis en gradering som er 700 px bred, og går ut i #ccc (lys grå). Det vil dermed være vanskelig å se at bakgrunnen "slutter", dersom den repeteres kun en gang.

 

Edit: Skalerbare overganger finnes muligens, men har ikke sett dem. Og innbiller meg at de ikke vil være kompatible med alle nettlesere. Altså: Finn er annen løsning dersom du ønsker en.

Endret 21. september 2006 av funkyboy

[qualbeen]

tror det er slik at man ikke kan skalere (bakgrunns)bilder i css, kun repetere. Ønsker man å skalere et bilde må man sette inn bildet i html, og så endre width/height på elementet (f.eks. via css).

[rønning]

Lag et bilde som er fra 1px til 5px bredt, og grader dette. Den fargen som graderingen ender ut i bruker du som bakgrunnsfarge (i dette eksempelet bruker jeg #ddd. Koden blir da slik:

 

background: url(gradient.png) repeat-y #ddd;

Endret 22. september 2006 av rønning

[funkyboy]

tror det er slik at man ikke kan skalere (bakgrunns)bilder i css, kun repetere. Ønsker man å skalere et bilde må man sette inn bildet i html, og så endre width/height på elementet (f.eks. via css).

6915008[/snapback]

 

 

Man kan kun repetere bakgrunner i CSS ja (Såvidt jeg vet). Om det er mulig med bruk av javascript, er jeg usikker på. Men tror det vil bli vanskelig pluss at det gir dårlig kompatibilitet. Dessuten ville det vært en litt merkelig ting å bruke tid på, isteden for å re- designe litt.