Bl4ck
2019-10-19, 22:31:35
Hallo,
Ich habe eine Frage. ich bin schon seit ein paar stunden dran, was in meinem Forum hin zu kriegen. Ich möchte gerne, wenn man mit der Maus Über das logo geht, das es sich paar PX nach rechts / links bewegt.
Ich hatte das hier gesehen: gta-5-forum.de
nun habe ich das alles bei mir eingetragen, ABER es bewegt sich einfach nicht.
ich habe es so gemacht als test:
<style>
.logo {
height: 100px;
margin: 18px 0 0 10px;
position: absolute;
left: 642px;
top: 9px;
transition: all 300ms;
}
.logo:hover {
animation-name: logo-move;
animation-duration: 500ms;
animation-direction: alternate;
animation-iteration-count: 1;
{
transform: translateX(0);
}
25% {
transform: translateX(5px);
}
75% {
transform: translateX(-5px);
}
100% {
transform: translateX(0);
}
}
</style>
<a href="/" class="logo-image"><img src="/sources/Unbenannt-6.png" alt="Forum" class="logo" title="Forum"></a>
Aber leider bewegt sich da gar nichts... was mache ich falsch?
Kann mir da einer helfen?
Grüße
Ich habe eine Frage. ich bin schon seit ein paar stunden dran, was in meinem Forum hin zu kriegen. Ich möchte gerne, wenn man mit der Maus Über das logo geht, das es sich paar PX nach rechts / links bewegt.
Ich hatte das hier gesehen: gta-5-forum.de
nun habe ich das alles bei mir eingetragen, ABER es bewegt sich einfach nicht.
ich habe es so gemacht als test:
<style>
.logo {
height: 100px;
margin: 18px 0 0 10px;
position: absolute;
left: 642px;
top: 9px;
transition: all 300ms;
}
.logo:hover {
animation-name: logo-move;
animation-duration: 500ms;
animation-direction: alternate;
animation-iteration-count: 1;
{
transform: translateX(0);
}
25% {
transform: translateX(5px);
}
75% {
transform: translateX(-5px);
}
100% {
transform: translateX(0);
}
}
</style>
<a href="/" class="logo-image"><img src="/sources/Unbenannt-6.png" alt="Forum" class="logo" title="Forum"></a>
Aber leider bewegt sich da gar nichts... was mache ich falsch?
Kann mir da einer helfen?
Grüße