• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

Kreise erstellen ohne Grafik (gif,jpg...)

DFI10X

DFI10X

New member
Ich suche nach einer Möglichkeit Kreise auf einer Webseite darzustellen und zwar ohne Grafikdatei.
Folgende Möglichkeiten habe ich bereits gefunden:

1.Möglichkeit

http://www.stunicholls.myby.co.uk/menu/index.html - siehe Schneeman
Hier wird einfach ein "Kreiszeichen" verwendet.
Der Nachteil ist folgender. Steck ich das ganze in ein DIV so ist dieses viel größer als das Kreisobjekt. Gezieltes anklicken ist also nicht möglich, vorallem wenn mehere Kreise beieinander liegen.

2. Möglichkeit:

http://msdn.microsoft.com/workshop/samples/author/filter/Alpha.htm - Style auf '2 - Radial' stellen.
Das ganze sieht schon so aus wie ein Kreis und ist im DIV nur so groß wie als wenn es ein Rechteck wäre. Das ist wurderbar, nur leider ist der Rand des Kreises sehr verschwommen.

Gibt es noch andere Möglichkeiten?
 
Mozilla spezifisch gibts da noch was mit runden Ecken.
siehe HIER
Aber wenn man sowas macht dann sollte es sicher besser browserübergreifend sein.

Die Beispiele sind ja ne ganz nette Spielerei, aber von der Arbeit soo aufwändig, das es im praktischen Einsatz wohl eher Vorteilhaft ist, eine Grafik zu verwenden.

Nichts desto trotz finde ich die Möglichkeiten sehr erwähnenswert.
 
Ja SVG kenn ich auch schon :)
Hab vor ner weile damit rumgebastelt ;)
Ist leider nicht das was ich brauche. Es sollte kein "Plugin" sein.
 
Hast du bei der ersten Möglichkeit mal versucht durch Angaben zum padding die Innenabstände auf Null zu setzen?
 
PS: bezogen auf Manitous Posting. Eigentlich müsste doch der anklickbare Bereich eines Kreiszeichens genau ein Quadrat sein, welches mit den Aussenkanten des Kreises übereinstimmt. Ich fragte mich schon wieso der Bereich denn in einem div anders sein sollte, es sei denn die div-Größe wird gezielt anders formatiert.
 
Das ist dieses Kreiszeichen: •
Markiert es mal, genauso groß ist dann das DIV.
Nun stelle man sich eine Webseite vor, auf der 2 Kreise genau untereinander sind mit onclick...
Das ist also nix. So wie ich das weiß werden DIVs immer mindestens so groß wie ihr Inhalt...
 
Divs kann man exakt skalieren, ergo auch kleiner als den Inhalt.
Der wird dann "abgeschnitten".
 
Achso, das hatte ich natürlich nicht bedacht... Das ist klar, das kann dann so nicht gehen.

So stante pede fällt mir jetzt nur ein, ein Div mit einem transparenten Gif zu machen und darin eine Kreisförmige Imagemap anzulegen. Die müßte man theoretisch auch einfärben können. Hab ich aber noch nie probiert. Vielleicht funktioniert das ja..
 
dkdenz schrieb:
Divs kann man exakt skalieren, ergo auch kleiner als den Inhalt.
Der wird dann "abgeschnitten".
Zum Vergrößern anklicken....

Bei solchen Zeichen kriegste das aber wohl schlecht hin, dass das Div immer genau den Kreis tangiert. Das ganze soll ja auch noch skalierbar sein. Da müßte dann ein ganzer Haufen Rechenaufwand betrieben werden.
 
Code: 
<DIV id=rec_0 style="FONT-WEIGHT: normal; FONT-SIZE: 12px; FILTER: alpha(opacity=100); LEFT: 0px; [B]WIDTH: 2px[/B]; CURSOR: default; COLOR: white; FONT-STYLE: normal; FONT-FAMILY: Verdana; POSITION: absolute; TOP: 0px; HEIGHT: 20px; BACKGROUND-COLOR: #0000cc; TEXT-DECORATION: none">Test Text der Zeigt, dass die Skalierung nix bringt :( </DIV>

Das DIV ist mindesetens so Breit wie das gößte Element zwischen ...></div>. Zumindest bei Text ist das so....
 
Kannst Du mal das Snippet für Dein Beispiel posten?
[EDIT]Oh, war wohl zu langsam. Hatte im QT gesucht...[/EDIT]
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben