Dynamisch achtergrond hoogte

[Freezerator]

Hoi,

Voor een website gebruik ik als achtergrond een mooie gradient van 1px breed, maar 3000px hoog. Nu wil ik op mijn forum, eenzelfde gradient toepassen, maar wel waarvan de hoogte dynamisch is.

Als er bv een topic is met 50 replies, dat niet halverwege de gradient opnieuw begint, want dat staat niet erg mooi. Nu vroeg ik me af of zoiets mogelijk is, en zoja, wat voor richting moet ik opzoeken? Ik dacht aan GD, maar dat lijkt me relatief ineffecient (tenzij ik de resultaten laat cachen). GD wou ik dan voor elke hoogte een gradient te laten maken, en mocht de hoogte al eerder gemaakt/berekend zijn, die oproepen. Aangezien het een relatief druk forum is, zoek ik iets wat niet te intensief is.

Kan iemand mij een duw in de goede richting geven? Of zit ik al te moeilijk te denken?

[ Voor 3% gewijzigd door Freezerator op 09-06-2004 14:25 ]

[Verwijderd]

Dit gaat gewoon bandbreedte vreten. Er is geen mooie manier om dat op te lossen, zonder een "oplossing" als de jouwe. Ik denk dat je dat fancy effect er gewoon uit moet laten.

[Verwijderd]

simpel te doen met CSS al hangt het natuurlijk wel af van je gradient (makkelijk te herhalen?)

code:

background-image: url(gradient.gif);
background-repeat: repeat-x;

[sjaakaq]

Miss. een fixed background (die dus niet meebeweegt met scrollen)?

[Bosmonster]

Zie Shadow3333. Dit combineren met een background-color en je bent klaar. Maakt de hoogte van de gradient niet uit zolang die maar uitkomt op de achtergrond kleur.

[Verwijderd]

Verwijderd schreef op 09 juni 2004 @ 14:30:
simpel te doen met CSS al hangt het natuurlijk wel af van je gradient (makkelijk te herhalen?)

code:

background-image: url(gradient.gif);
background-repeat: repeat-x;

Ik denk dat TS een gradient heeft die bijvoorbeeld van Blauw naar Rood loopt en dat Blauw bovenaan moet en Rood helemaal onderaan. Dan kan je dus niet een repeat-x gebruiken...
óf zo'n script wordt bandbreedte verslindend óf hij moet van het plan afstappen.

[Verwijderd]

Of hij moet checken wat de resolutie van de bezoeker is en vanuit dat gegeven de .gif gaan kiezen.

1 .gif voor 1024x768
1 .gif voor 800x600
1 .gif voor 1280x etc.

[ Voor 38% gewijzigd door Verwijderd op 09-06-2004 14:35 ]

[Verwijderd]

Verwijderd schreef op 09 juni 2004 @ 14:33:
Ik denk dat TS een gradient heeft die bijvoorbeeld van Blauw naar Rood loopt en dat Blauw bovenaan moet en Rood helemaal onderaan. Dan kan je dus niet een repeat-x gebruiken...
óf zo'n script wordt bandbreedte verslindend óf hij moet van het plan afstappen.

Ik kan helaas in tegenstelling tot jij niet in zijn hoofd kijken, dus ik probeer hem op weg te helpen, dit is de makkelijkste manier om een herhalend plaatje netjes te repeteren, zoals ik al zei in mijn post, afhankelijk van de gradient is dit de beste oplossing.

[pagani]

In php de achtergrond genereren

Gaat wel resources vreten, maar het werkt wel.

[Bosmonster]

Verwijderd schreef op 09 juni 2004 @ 14:33:
[...]


Ik denk dat TS een gradient heeft die bijvoorbeeld van Blauw naar Rood loopt en dat Blauw bovenaan moet en Rood helemaal onderaan. Dan kan je dus niet een repeat-x gebruiken...
óf zo'n script wordt bandbreedte verslindend óf hij moet van het plan afstappen.

Ik snap je logica niet, want dit werkt namelijk perfect. Als je een verticaal plaatje neemt van 1 pixel breed (of bij voorkeur doe ik altijd 2 pixels voor snellere opbouw) en deze repeat je alleen op de x-as dan heb je precies wat TS wil

Dit gebruiken we namelijk hier regelmatig...

voorbeeldje

[ Voor 11% gewijzigd door Bosmonster op 09-06-2004 15:05 ]

[Freezerator]

Ik wil de y-as op, niet de x-as. De x-as is het probleem niet.

Maar ik zit te denken aan een minder fancy oplossing, gewoon een dubbele gradient te maken, bv rood-blauw, en blauw-rood, en die gewoon onder elkaar zetten.

Maar het liefst dus een gradient die van rood-blauw gaat, de ene keer 100px hoog is, maar andere keer bv 3000px hoog is.

Fixed/meescrollende background is opzich ook wel een idee...

[Bosmonster]

Voor een website gebruik ik als achtergrond een mooie gradient van 1px breed, maar 3000px hoog. Nu wil ik op mijn forum, eenzelfde gradient toepassen, maar wel waarvan de hoogte dynamisch is.

Als er bv een topic is met 50 replies, dat niet halverwege de gradient opnieuw begint, want dat staat niet erg mooi.

Ehh? Dit is toch echt een verticale gradient (die dus repeat op de x-as) die je hier beschrijft (zoals het voorbeeld dus)

[edit]
Of bedoel je dus dat de gradient altijd de hoogte van HET SCHERM moet hebben?

[ Voor 9% gewijzigd door Bosmonster op 09-06-2004 15:11 ]

[André]

En als je nu een blauw-rood-blauw gradient maakt? Die kun je op de y-as blijven herhalen

[Freezerator]

hoogte is toch y-as?

breedte = x-as?

Kijk, iets in de breedte repeaten is simpel, maar iets mooi in de hoogte repeaten word ingewikkelder.

Ik hoop dat ik het zo goed uitleg, ik kan anders wel een voorbeeld image posten hoe het er anders uitziet? Of ik doe gewoon niet zo moeilijk meer, en stel me background color in op bv blauw, als me gradient van rood naar blauw loopt.

[André]

Freezerator schreef op 09 juni 2004 @ 15:13:
hoogte is toch y-as?

breedte = x-as?

Kijk, iets in de breedte repeaten is simpel, maar iets mooi in de hoogte repeaten word ingewikkelder.

Ik hoop dat ik het zo goed uitleg, ik kan anders wel een voorbeeld image posten hoe het er anders uitziet? Of ik doe gewoon niet zo moeilijk meer, en stel me background color in op bv blauw, als me gradient van rood naar blauw loopt.

Dan maak je de achtergrond 300px breed en centreer je hem, dan background-repeat:repeat-y

[Freezerator]

André schreef op 09 juni 2004 @ 15:11:
En als je nu een blauw-rood-blauw gradient maakt? Die kun je op de y-as blijven herhalen

Ja die beschrijf ik al hier 2 postings boven, zoiets leek me opzich ook wel mooi effect.

Maar, ik leg me voorlopig neer, want opzich hebben jullie me aan nieuwe ideeen geholpen.
Tnx in elk geval!

[Verwijderd]

y-as ook goed heb ff snel wat in elkaar gevogeld

http://www.drunk.nl/tweakers/dropshadow/

heel simpel, maar wel een mooi repeterend effectje.

[Bosmonster]

Freezerator schreef op 09 juni 2004 @ 15:13:
hoogte is toch y-as?

breedte = x-as?

Kijk, iets in de breedte repeaten is simpel, maar iets mooi in de hoogte repeaten word ingewikkelder.

Ik hoop dat ik het zo goed uitleg, ik kan anders wel een voorbeeld image posten hoe het er anders uitziet? Of ik doe gewoon niet zo moeilijk meer, en stel me background color in op bv blauw, als me gradient van rood naar blauw loopt.

Een verticale gradient (van boven-naar-beneden) bereik je door een gifje op de x-as te repeaten. Een horizontale gradient (van links naar rechts) bereik je door een gifje op de y-as te repeaten.

Wat jij in je openingspost beschrijft is een verticale gradient van 1 pixel breed, die je dus over de x-as repeat. Maar blijkbaar bedoel je dus exact het tegenovergestelde

[Verwijderd]

Hij wil een verticale gradient, dus precies zoals je in jou flame-aan-mij-linkje gaf, alleen dan met een variabele hoogte; de ene keer 500px de andere keer 750px...

[Bosmonster]

Verwijderd schreef op 09 juni 2004 @ 16:09:
Hij wil een verticale gradient, dus precies zoals je in jou flame-aan-mij-linkje gaf, alleen dan met een variabele hoogte; de ene keer 500px de andere keer 750px...

Kweet niet waar jij een flame hebt gezien, maar ik kan hem niet vinden. Het was gewoon een voorbeeld van hoe ik zie dat het kan door slechts gebruik te maken van een klein repeterend gifje.

De gradient in het voorbeeld kan iedere willekeurige hoogte aannemen, afhankelijk van het gifje dat je gebruikt.

[Verwijderd]

Precies en daar zit het hem dus in... Je moet dan dus voor elke hoogte apart een nieuw gifje maken van 1 x hoogte. Dat leek mij nogal dom, daarom stelde ik voor dat hij dat facny effect er maar uit moet halen, of zoals eerder is gezegd een repeat-x en repeat-y hebben als je een goeie gradient kiest; rood-blauw-rood oid.

[Bosmonster]

Of een makkelijkere oplossing is dus een gradient te nemen en die over te laten lopen in een vaste kleur. Kun je toch een gradient houden en heb je niet het probleem dat ie zich herhaalt na x hoogte.

Overigens zullen we heb maar niet hebben over hoe een gradient van blauw naar rood eruit ziet

[ Voor 21% gewijzigd door Bosmonster op 09-06-2004 17:57 ]

[Freezerator]

Verwijderd schreef op 09 juni 2004 @ 16:09:
Hij wil een verticale gradient, dus precies zoals je in jou flame-aan-mij-linkje gaf, alleen dan met een variabele hoogte; de ene keer 500px de andere keer 750px...

Precies

En ik doe geen rood-blauw , denk eerder geel bruin
Maar, ik doe idd de minder fancy oplossing, en dat werkt ook prima.