Cirkel html php 4 delen moeten er 6 worden

Status
Niet open voor verdere reacties.

Seantf

Gebruiker
Lid geworden
23 apr 2013
Berichten
140
Hallo ik heb hier een cirkel met 4 delen maar ik wil er graag 1 met 6 delen kan iemand mij hiermee helpen? En later moet ik er ook 1 met 30 delen


Html
Code:
<link rel="stylesheet" type="text/css" href="style.css">


<div id="center">
<div id="tl"></div>
<div id="tr"></div>
<div id="bl"></div>
<div id="br"></div>
</div>

CSS

Code:
div {
width: 50px;
height: 50px;
background-color: #ccc;
background-color: #ccc;
-moz-border-radius: 100px ;
border-radius:  100px;

}

#center {position: relative; margin: 100px 0 0 100px; border: solid #fff 1px; }

#tl, #tr, #bl, #br {
position: absolute;
height: 75px;
width: 75px;

}

#tl {
  border-radius: 100px 0 0 0;
  -moz-border-radius: 100px 0 0 0;
  top: -50px;
  left: -50px;
  z-index: -1;
}

#tr {
  border-radius: 0 100px 0 0;
  -moz-border-radius: 0 100px 0 0;
  top: -50px;
  left: 26px;
  z-index: -1;
}

#bl {
  border-radius:  0 0 0 100px;
  -moz-border-radius:  0 0 0 100px;
  top: 26px;
  left: -50px;
  z-index: -1;
}

#br {
  border-radius: 0  0 100px 0;
  -moz-border-radius: 0  0 100px 0;
  top: 26px;
  left: 26px;
  z-index: -1;
}
 
Het probleem zit hem er in wat ik er later mee moet gaan doen voorbeeld:
Aanpasing.png

En dat moet ik dan omzetten naar een pdfje zodra ik canvas of svg ga gebruiken en probeer hem om te zetten naar pdf dan glitcht het heleprogramma :S

Uit eindelijk moet de ring met al dit tabjes klikbaar worden en kleur veranderd worden

de textboxen moeten direct aanpasbaar zijn als je dubbel klikt en dan weer dubbel klikken om te locken :S

Dus eigelijk moet ik het gewoon met html en php doen zonder canvas of svg.
Is dit mogelijk ?
 
ik zou hem dan omleiden naar een script met ImageMagik, en daar een map overheen leggen.
Want om nu divjes te maken in puur HTML van 1x1 pixel.. die clickable zijn, is me A HELL LOT OF CODE.

Juist voor dit soort toepassingen zijn canvas en svg uitgevonden.
 
Canvas en svg hebben de nadelen van dat textboxen en dergelijke toevoegen gaat lastig tot niet en positioneren is nog moeilijker en zodra je een pdfje er van wilt maken gaan de delen of weg of ze staan op een andere plek dna waar jij ze gepositioneerd heb :S ik kan het opzich wel met ene plaatje laten zien wat ik bedoel.
 
1.jpg
2.jpg

Zoals je ziet het is helemaal naar de knoppe door canvas/svg :S
 
Ik snap er niets van van dat imagick :X Als er nog andere opties zijn hoor ik ze graag anders ga ik de pdf converter er gewoon vanaf halen dan moet er maar een screen shot gemaakt worden.
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan