• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Slidingdoors-Navigation

K

Kev95

Mitglied
Hallo,
ich will die Navigation, von einem meiner neuen Projekte mit Hover-Effekten gestalten.
Dazu benutze ich die Sliding-Doors-Technik. Soweit klappt alles ganz gut.


Nur muss ich die rechte und die linke Buttonhälfte so überlappen lassen, das der Button überall aktiv wird und nicht nur an einer Ecke.
Hier könnt ihr euch das Problem live anschauen: Fahrt mit der Maus zuerst über die linke Buttonhälfte, dann über die rechte.


Es dürfte nur an einem Padding liegen, ich teste schon seit einer Stunde die verschiedensten Einstellungen und finde sie einfach nicht.
Vielleicht kann mir jemand von euch helfen. ;)


Danke im Vorraus,
Kevin
 
Werbung:
Hallo,

warum nutzt du denn diese Technik. Da werden 2 Bilder übereinander geschoben um den Effekt zu erreichen. Das kannst du auch einfacher haben mit Box-shadow.
Den Effekt kannst du dir hier zusammenbauen CSS3 Generator mit Box-Shadow dann Inset auswählen und Horizontal und Vertical Lenght auf 0 lassen und Blur in Pixel einstellen wie weit der Effekt gehen soll.

Dein Kopfbereich deiner Webseite muss dazu wie folgt lauten:
HTML: 
<!DOCTYPE HTML>
<html>         
    <head>        
        <meta charset=UTF-8>
 
Wustersoss schrieb:
Hallo,

warum nutzt du denn diese Technik. Da werden 2 Bilder übereinander geschoben um den Effekt zu erreichen. Das kannst du auch einfacher haben mit Box-shadow.
Den Effekt kannst du dir hier zusammenbauen CSS3 Generator mit Box-Shadow dann Inset auswählen und Horizontal und Vertical Lenght auf 0 lassen und Blur in Pixel einstellen wie weit der Effekt gehen soll.
Zum Vergrößern anklicken....

Das ist eine richtig gute Idee und hat funktioniert!
Vielen Dank dafür. :D
 
Werbung:
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben