6 svar · 433 visningar · startad av Nexus86
Nån som har nån aning om hur man gör en toningseffekt lodrätt som bakgrund. Den ska inte vara upplösningsberoende utan visas korrekt med alla upplösningar. Det gör däremot inget om den inte ändrar storlek samtidigt som fönstret. Hur uppnår man detta? 
Varför inte tona en bild och ha som bakgrund? Det är gjort på 2 sek i Photoshop..
Gradient filter
Testa dig fram. Och som vanligt med filter så är de IE specifika. 
Som bymarie säger, gör en bild i något program.
Sedan placerar du bilden som bakgrund med hjälp av css.
body {
background-color:#000000;
background-repeat:no-repeat;
background-position: top left;
background-attachment:fixed;
background-image: url(img/gradient.gif);}
Du kan byta ut "no-repeat" mot "repeat-y(x)! beroende på vad som passar dig.
Ett alternativ är annars att ha en enfärgad bakgrund, skapa ett lager som innehåller en enfärgad png med en gradient alpha-kanal som tonar från 0% till 100% och sätta height 100% och z-index:1 på den. Sedan lägger du resten av innehållet i ett lager med z-index:2.
av alla dessa verkar det vara som om higa var den som förstog
bäst eller iallafall gav det svar jag gillade bäst.. ¦)
bymarie: gör jag det och man har för stor upplösning så börjar
bilden om under..
dino: jag vet hur man gör gradients.. det behövs inget filter för
det.. men samma som för bymarie, då kommer bilden börja om
under igen..
frankof: det är en möjlighet men om man har fetingupplösning,
som t.ex. 1600x1200 så kommer den översta färgen att vara
mycket mindre än resten..
Nexus86 skrev:
dino: jag vet hur man gör gradients.. det behövs inget filter för det.. men samma som för bymarie, då kommer bilden börja om
under igen..
Du har nog missförstått det, detta är ingen bild. Om du använder tex koden under så får du en gradient som är samma oavsett upplösning.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>
</head>
<body ID="oFilterDIV" style="filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#0000FF', EndColorStr='#00000000')">
</body>
</html>