div langs ovaal uitlijnen

[henkhoogerbrug]

de titel roept misschien nog meer vragen op, maar ik ga proberen om het probleem uit te leggen en hoop dat jullie me kunnen helpen.

Het doel is om een aantal layers (div's) rond een denkbeeldige halve ovaal te plaatsen. De vorm is dus te vergelijken met het teken: ")" en het resultaat zou dus zoiets moeten zijn:

div1
...div2
......div3
...div4
div5


Het lukt me wel om de div's statisch via css op de juiste positie te krijgen, maar ik wil het dynamisch maken via javascript. Kort samengevat heb ik dus twee vragen:

1. Hoe maak ik een ovaal (of eigenlijk een halve ovaal)
2. Hoe krijg ik de coördinaten bij een variabele verdeling (in het voorbeeld heb ik 5 div's, dit kunnen er echter ook 6 of meer worden)
   div1 en div5 moeten echter op een vaste positie blijven staan (div2,3,4 moeten dus verdeeld worden binnen de overgebleven ruimte).

Graag jullie hulp.

 

[dominiqu3]

Tot zover ik weet is dit dynamisch niet mogelijk, wel is het mogelijk om met (ingewikkeld) javascript te kijken wat de positie is van je div op de pagina en die daar vanuit positioneren... Dan heb je alleen een formule nodig die je op je plaatje en je code toepast.

Wel heb ik ergens in mijn bookmarks (kan de link ff niet vinden) een bookmark van een pagina waarbij je dit gemakkelijk zelf handmatig zou moeten kunnen instellen (dus dat moet je per pagina doen).... kan alleen de link ff niet zo snel vinden

 

[Johantrax]

Ik heb enkele maanden geleden een gelijkaardig probleem gehad dat erom draaide om mijn tekst de kromming van een achtergrondafbeelding te laten volgen.
Gedeeltelijke oplossingen vond ik door gebruik te maken van 'slants', border-illusies, boxpunches, en/of curved-images.

Voorbeelden en uitleg:
curves
slants
boxpunch
boxpunch - demo

En eentje voor de fun
border-illusions

 

[henkhoogerbrug]

ik ben er nog niet echt mee verder gegaan, kwam vandaag echter wel een mooi voorbeeld tegen wat ik jullie niet wilde onthouden: http://nl.wikipedia.org/wiki/Ellips_(wiskunde)

Volgens mij moet het dus mogelijk zijn om de posities te bepalen en dit te gebruiken voor de eigenschappen top-/left- om de div's te positioneren.