runde Elemete
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
bild
browser
dank
element
erstellen
form
grafik
hantieren
http
koordinate
kreisen
leute
nummer
regenbogen
ringen
runde ecken
url
versuchen
wissen
zauberwort
-
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
Das Zauberwort heißt css3 und runde Ecken.
Google überschüttet dich mit Beiträgen dazu. Allerdings ist es noch nicht eindeutig in allen Browser angekommen. Du kannst auch mit Bildern und entsprechendem CSS hantieren, um auf Nummer sicher zu gehen.
Beitrag zuletzt geändert: 4.5.2013 19:04:33 von flockhaus -
hey,
danke, klar, google überschüttet einen mit allem möglichen, aber erstens wollte ich wissen was am besten funktioniert, optimal in allen browsern.
außerdem weiß ich noch immer nicht wie ich zum beispiel ein element gestalte, das die form eines regenbogens hat und nur diese form auch als linkfläche benutz werden kann.
danke -
flockhaus schrieb:
Du kannst auch mit Bildern und entsprechendem CSS hantieren, um auf Nummer sicher zu gehen.
flockhaus hat dir bereits den entscheidenden Tip gegeben.
Dein Regenbogenbild musst du schon selbst gestalten und einbetten.
Das Element <img> lässt Klickereignisse zu. -
danke nochmal, aber auf was ich hinaus möchte:
einen kreis, um denn dann nochmal ein ring gelegt ist, jedoch ist dieser ring geviertelt, also vier "regenbogenförmige" flächen, die dann jeweils inklusive dem kreis als linkfläche dienen sollen, ohne dass sie sich überlagern! -
marvis schrieb:
Da hättest du deine Frage konkreter stellen sollen
aber erstens wollte ich wissen was am besten funktioniert, optimal in allen browsern.
Oha, das klingt ambitioniert. Ich vermute mal, dass das mit reinem CSS nicht machbar ist, obwohl du auch Formen erstellen kannst.
Ich denke, du musst ein bisschen mit HTML5 und Javascript tüfteln, vielleicht ist das damit inzwischen machbar.. Allerdings ist dann fraglich, ob's in allen Browsern auch wie gewollt dargestellt wird.
Die einfachste, wenn auch nicht wirklich gute Variante: erstelle ein entsprechendes Bild in einem Grafikprogramm und weise mit HTML/CSS Linkflächen zu.
Beitrag zuletzt geändert: 4.5.2013 19:18:52 von flockhaus -
In allen Browsern ist das nicht möglich die Methode mit Css3 ist die Beste und funktioniert mit fast allen Browser darum ist die die beste Methode
-
danke, dann werd ich es damit mal versuchen :)
-
hi,
also natürlich kannst du einzelne kreisbögen erstellen und diese so überlagern das immer nur das entsprechende stück sichtbar ist, aber die linkflächen kreisrund zu bekommen wird dann schon schwieriger. dazu könntest du eine html-imagemap zur hilfe nehmen, bei der auch runde angaben zum definieren von linkflächen möglich sind... http://de.selfhtml.org/html/grafiken/verweis_sensitive.htm
...oder aber du setzt auf das canvas-element von html5 bei dem du sowohl die grafik als auch den link direkt über js realisieren kannst - allerdings wird da der internetexplorer nicht ganz so einfach mitmachen (der kocht da mal wieder sein eigenes süppchen, aber dafür gibts auch workarounds siehe "canvas für den ie") -
danke, aber ich mag ehrlich gesagt kein java script und möchte deswegen auf js soweit es geht verzichten....
-
das ist eine etwas veralterte ansicht meiner meinung nach... aber dann nimm doch eine image-map, die kannst du ja auch als transparentes bild im vordergrund über deine regenbogen-elemente legen wenn du die lieber mit css und als runde ecken erstellen willst als als grafiken, musst halt nur die koordinaten in der map entsprechend setzen...
-
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage