Statische bg variabel maken?

[maarud]

Ik heb een plaatje wat onbewerkt ongeveer 2500 x 1500 is. Nu wil ik dat dit de achtergrond van een site wordt, alleen, niet iedereen heeft dezelfde resolutie, dus als ik eentje van 1280x1024 maak, klopt het niet bij mensen met een andere resolutie, etc etc.

Nu vroeg ik mij dus af, is er een mogelijkheid om te zorgen dat de achtergrond altijd klopt, ongeacht de resolutie? Omdat het verschillende kleuren zijn kan ik niet een stukje van 10x10 px nemen en op repeat zetten, anders was het zo gepiept

[Verwijderd]

lastig, beste is gewoon zorgen dat je layout goed schaalt, of je achtergrond zo maken dat je er stukken van kan opofferen

een andere mogelijkheid is een plaatje (<img> element dus) achter de hele boel neerzetten en die de juiste breedte meegeven.

Nu ziet dat er ranzig uit, dus op het moment dat dat geladen is ga je een request doen naar een plaatje met de juiste dimensies die je op dat moment server side gaat genereren. Dat duurt even, dus tot dan toe is de ranzig geschaalde een aardig alternatief

zie http://www.rikkertkoppes.com/tests/imgscaler/ voor een proof of concept dat ik ooit maakte (speel met venster grootte)

[AtleX]

Een plaatje van 2500x1500 is ook nogal slecht voor de laadtijd van je site en je dataverkeer.

[maarud]

Die wordt natuurlijk geresized En hij is nu al 230kb dus dat valt wel mee.
Ik zal eens even die link van hierboven bekijken

[marcvangend]

Is het heel erg als er een randje van de afbeelding af valt?
Ik zou een aantal standaard-formaten creëren met bv. photoshop, bv. met intervallen van 200 pixels. Vervolgens check je met javascript in je head de breedte/hoogte van de browser (neem de binnenmaten, check www.quirksmode.org voor de js code). Die waardes rond je naar boven af, zodat je een van je standaardwaarden krijgt. Die file wijs je met css als achtergrond aan de body toe. Gebruik de css property 'background-position: center center;' om de achtergrond te centreren.

[Amorphis]

Kan heel simpel door een image een breedte en hoogte van 100% te geven.

[maarud]

hmm, leuke tips, alleen werken geen van allen echt goed...
het zit namelijk zo, het menu moet precies op een gedeelte van de achtergrond komen (in dit geval een lijntje). Met img width="100%" e.d. is ht plaatje op zich wel goed, alleen komt het menu dan niet exact op het plaatje dus ik vroeg mij af of dit uberhaupt wel gaat lukken....