via css hoeken foto automatisch afronden

[Verwijderd]

Ik vraag mij af of het volgende via css mogelijk is. Een foto van een bepaalde grootte (deze grootte kan variëren) die je upload via een cms bijvoorbeeld; door het toepassen van een stylesheet worden de hoeken automatisch afgerond.

De grote vraag is hoe de variërende groottes opgevangen moeten worden. Heeft iemand hier een idee van. Ik heb wel ervaring met CSS/XHTML maar hier weet ik zo direct het antwoord niet op.

[Rowanov]

Verwijderd schreef op zaterdag 12 augustus 2006 @ 13:34:
Ik vraag mij af of het volgende via css mogelijk is. Een foto van een bepaalde grootte (deze grootte kan variëren) die je upload via een cms bijvoorbeeld; door het toepassen van een stylesheet worden de hoeken automatisch afgerond.

Het gaat ooit wel mogelijk worden met css, in css3 waarschijnlijk, maar met de huidige implementatie kan het niet. Daarmee bedoel ik dat het ooit wel crossbrowser werkt, want het werkt mogelijk in een aantal browsers wel.

De grote vraag is hoe de variërende groottes opgevangen moeten worden. Heeft iemand hier een idee van. Ik heb wel ervaring met CSS/XHTML maar hier weet ik zo direct het antwoord niet op.

Je kan het serverside met php-gd aanpakken, dat lijkt me het makkelijkst. Je geeft zelf al aan dat je het via je cms upload, dus kan je in het upload script een aanpassing maken waardoor de foto eerst door de gd mangel heen gaat, voordat hij definitief op de goede plek op je server wordt gezet. Natuurlijk is het ook met css mogelijk, maar dan heb je altijd extra elementen nodig die je over de foto heen plaatst. Dat kun je iig proberen.

[ Voor 14% gewijzigd door Rowanov op 12-08-2006 13:43 . Reden: even wat info toegevoegd ]

[user109731]

Je zou iets kunnen doen met 4 hoekjes (4 kleine afbeeldingen dus), 1 positioneer je linksboven op je foto, 1 linksonder, 1 rechtsboven en 1 rechtsonder. Gecko browsers ondersteunen -moz-border-radius, is misschien handig om mee te testen.

[rickmans]

Je zou kunnen kijken hoe dat bij nifty corners is aangepakt .