master94
چهارشنبه 15 بهمن 1393, 11:47 صبح
سلام
به جای استفاده از marquee ، اومدم با animation css همون کارو کردم
<p class="marquee">test test test test test</p>
/* Make it a marquee */.marquee {
width: 450px;
margin: 0 auto;
overflow: hidden;
white-space: nowrap;
box-sizing: border-box;
animation: marquee 4s linear infinite;
}
.marquee:hover {
animation-play-state: paused
}
/* Make it move */
@keyframes marquee {
0% { text-indent: 27.5em }
100% { text-indent: -105em }
}
ولی یه مشکلی هست،وقتی یک بار انیمیشن اجرا میشه ، تا بخواد دوباره اجرا شه یکم زمان میبره!
میخوام جوری باشه که تا انیمشن تموم شد،دوباره تکرار شه....
منظورم اینه وقتی یک بار "test test test test test" تموم میشه،سریع loop نمیشه...!!!
فک کنم مربوط به text-indent باشه ، ولی هرجوری امتحان میکنم،نمیشه :گریه:
ممنون میشم راهنماییم کنید :بوس:
به جای استفاده از marquee ، اومدم با animation css همون کارو کردم
<p class="marquee">test test test test test</p>
/* Make it a marquee */.marquee {
width: 450px;
margin: 0 auto;
overflow: hidden;
white-space: nowrap;
box-sizing: border-box;
animation: marquee 4s linear infinite;
}
.marquee:hover {
animation-play-state: paused
}
/* Make it move */
@keyframes marquee {
0% { text-indent: 27.5em }
100% { text-indent: -105em }
}
ولی یه مشکلی هست،وقتی یک بار انیمیشن اجرا میشه ، تا بخواد دوباره اجرا شه یکم زمان میبره!
میخوام جوری باشه که تا انیمشن تموم شد،دوباره تکرار شه....
منظورم اینه وقتی یک بار "test test test test test" تموم میشه،سریع loop نمیشه...!!!
فک کنم مربوط به text-indent باشه ، ولی هرجوری امتحان میکنم،نمیشه :گریه:
ممنون میشم راهنماییم کنید :بوس: