abgeschrägte Buttons mit Rollover versehen
Ben
- html
0 joeyfle0 Cheatah0 Ben
0 Chräcker Heller0 Ben
Hallo,
ich habe das Problem, dass ich gern abgeschrägte Buttons, die direkt aneinander grenzen mit einem Rollover (Änderung der Hintergrundfarbe) versehen möchte. Nun sind ja Bilder, die ich mit einem Rollover-Effekt versehen kann, an sich immer viereckig und haben höchstens transparente Bereiche. Wenn ich die Bilder jedoch rechteckig "zerschneide" und dann mit nem Rollover versehe, dann fehlt ja jeweils beim Rollover ein kleines Stück des Effektes.
Ich habe überlegt, jeden Button auf einen einzelnen Layer zu legen und diese dann aneinander zu setzen, aber soweit ich weiß, kann das doch zu Darstellungsfehlern in diversen Browsern kommen, oder?
Ich hoffe, mein Problem ist verständlich geworden und mir kann jemand einen kleinen Denkanstoß geben.
Vielen Dank im Voraus und viele Grüße aus Wolfsburg,
Ben
Abgesehen von der Browserfrage:
Mit einer Kombination aus einem negativem top- oder bottom-margin und einem z-index sollte das Problem zu lösen sein.
Hi,
ich habe das Problem, dass ich gern abgeschrägte Buttons, die direkt aneinander grenzen mit einem Rollover (Änderung der Hintergrundfarbe) versehen möchte. Nun sind ja Bilder, die ich mit einem Rollover-Effekt versehen kann, an sich immer viereckig und haben höchstens transparente Bereiche. Wenn ich die Bilder jedoch rechteckig "zerschneide" und dann mit nem Rollover versehe, dann fehlt ja jeweils beim Rollover ein kleines Stück des Effektes.
dann änderst Du dieses kleine Stück eben auch, ist doch kein Problem. Wenn Du mit HTML arbeitest, _musst_ Du in Rechtecken denken. Alles andere klappt nicht.
Ich habe überlegt, jeden Button auf einen einzelnen Layer zu legen
Eieiei. Veto, weil zu kompliziert und potentiell inkompatibel. Das Problem ist ab Netscape 3 aufwärts ohne weiteres lösbar.
Ich hoffe, mein Problem ist verständlich geworden und mir kann jemand einen kleinen Denkanstoß geben.
Zerschneide in Rechtecke. Überlege Dir, welche Rechtecke Du wann ändern musst. Stelle die entsprechenden Grafiken bereit.
Cheatah
Hi Cheatah,
da hast du wohl recht. Dann wird das ganze sicher ganz schön aufwendig. Müsste ja gehen, wenn ich bei einem MouseOver einfach mehrere Bildteile austausche. Dann werd ich mal rumbasteln.
Danke für den Hinweis. :) Weiß gar nicht, warum sich so oft Leute über deine Postings beschweren...aber naja.
Viele Grüße,
Ben
Hallo,
ich würds mit handelsüblichen images und mouseover machen. Und zwar so:
+----+----------+----+
______!____!__________!____!_______
! \ ! ! \ !
button ! \ ! button2 ! \ ! button3
______!___!__________!___!_______
! ! ! !
+----+----------!----+
...also die Übergänge bzw Randbereiche als eigenes image und die Mitte des Buttons als image. Fährt die Maus über das image des button 2, dann werden drei images entsprechend ausgetauscht.......(Dazu sollte die "Schrägen" nicht allzu steil sein, denn diese sind dann "tote Bereiche", die nicht maussensitiv sind....
Chräcker
Hallo,
vielen Dank für den Tipp. Habe es jetzt so probiert. Ist zwar etwas aufwendig, klappt aber gut. Vielleicht kann ich ja die "Zwischenbereiche" mit einer Miniversion einer Image-Map versehen und diese somit auch maussensitiv machen?
Vielen Dank und viele Grüße,
Ben