samedi 11 avril 2015

[FRAGE] Laufschrift mittels CSS3

Hi,



ich möchte gerne eine Laufschrift mittels CSS3 erstellen. Dazu habe ich den untenstehenden Code gefunden, den ich leicht geändert habe. Der Script läuft auch einwandfrei. Jedoch gibt es zwei Punkte, die mich stören:



1. Je länger der Text, desto schneller scrollt der Text. Gibt es eine Möglichkeit, den Text, unabhängig der Länge, in einer festen Geschwindigkeit zu scrollen?

2. Der Text hackt teilweise d.h. bleibt kurz stehen und scrollt dann weiter. Gibt es hier eine Möglichkeit, das ganze zu optimieren?



Könnt Ihr mir helfen? Bin leider komplett ratlos. Danke im voraus :)






Code:



<style>

.marquee {

width: 600px;

margin: 0 auto;

white-space: nowrap;

overflow: hidden;

box-sizing: border-box;

}

.marquee span {

display: inline-block;

padding-left: 100%;

animation: marquee 15s linear infinite;

-webkit-animation: marquee 15s linear infinite;

}

@-webkit-keyframes marquee {

0% { transform: translate(0, 0); }

100% { transform: translate(-100%, 0); }

}

@keyframes marquee {

0% { transform: translate(0, 0); }

100% { transform: translate(-100%, 0); }

}

</style>

<div class="marquee"><span>Das ist ein Test</span></div>








[FRAGE] Laufschrift mittels CSS3

Aucun commentaire:

Enregistrer un commentaire