Zitat:
Zitat von top
Dein animierter Balken wird mit "::after" vom Link im letzten Listenelement erzeugt. Bist du auf der letzten Seite, hast du dort nur noch ein "strong" und kein "a".
Wenn du dort dein "a" durch "> *" ersetzt, funktioniert es wieder:
Code:
#navigation #navigationsmodul ul li:last-child > *::after {
content:"";
position:absolute;
right:inherit;
bottom:-3px;
width:inherit;
height:3px;
pointer-events:none;
/*transition*/
-webkit-transition:all .5s ease;
-moz-transition:all .5s ease;
-o-transition:all .5s ease;
transition:all .5s ease; }
#navigation #navigationsmodul ul li:nth-child(1) ~ li:last-child > * {right:40em;width:10em;}
#navigation #navigationsmodul ul li:nth-child(2):hover ~ li:last-child > * {right:30em;width:10em;}
#navigation #navigationsmodul ul li:nth-child(3):hover ~ li:last-child > * {right:20em;width:10em;}
#navigation #navigationsmodul ul li:nth-child(4):hover ~ li:last-child > * {right:10em;width:10em;}
#navigation #navigationsmodul ul li:nth-child(5):last-child:hover > * {right:0;width:10em;}
#navigation #navigationsmodul ul li:hover ~ li:last-child > *::after,
#navigation #navigationsmodul ul li:last-child:hover > *::after {background:#c351fa;}
|
Fantastisch! Ganz herzlichen Dank Dir!!