Autor Zpráva
MontyX
Profil
Ahoj, mám tento kód
.circle {
  background: red;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
}
<div class="circle"></div>
A potřeboval bych udělat něco takovéhoto:

Předem děkuji
xROAL
Profil
Živá ukážka s použitím transform (podpora od IE9 s prefixom -ms- ktorý som do ukážky nezahrnul).
Jcas
Profil
http://kod.djpw.cz/vieb

jsem si zkoušel hrát. Zkusil jsem napozicovat na sebe - jedno kolečko, pak na něj štvereček, co překryje ten roh a pak další kolečko.
Moc mi nešlo to druhé kolečko napozicovat tak, aby bylo přesně na středu.

A pak jsem zkusil jedné straně border dát bílou a pootočit to, aby to bylo na rohu.
Nicméně ani jedno se mi nelíbí.

Asi bych to řešil tak, že bych si udělal obrázek a dal ho na pozadí.


xROAL:
Koukám, že tě napadlo to samé.
MontyX
Profil
Díky, ale potřeboval bych aby to mohla být i menší část
Viz:

Obrázkem to dělat nechci... Ono se to ohraničení zobrazí až po najetí na ten kruh a na webu mám více barevných kombinací a musel bych dělat každý obrázek zvlášť...
Jcas
Profil
Možná ti pomůže toto
MontyX
Profil
Děkuji, ale vzhledem k tomu, že na stránce bude těchto kruhů více než 10, každý s jinou "velikostí" a jinou barvou ohraničení, tak se mi tohle řešení nezdá moc ideální.
Jcas
Profil
Když budeš mít více kruhů s rúznýma velikostma, tak stejně budeš muset pro každý nastavovat hodnoty, ne?
Tady si můžeš script strčit do funkce a hodnoty jí můžeš předat jako parametry při volání. (průměr, výřez atd.)
Každý kruh si tu funkci zavolá a předá jí ty hodnoty, které potřebuješ.

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: