ساخت باکس متحرک با css3

[oMid 2114]

کد های css زیر را به استایل مورد نظر اضافه کنید:

.anime {
width:100px;
height:100px;
background:red;
position:relative;
animation:boxmove 5s linear;
-moz-animation:boxmove 5s infinite; /*Firefox*/
-webkit-animation:boxmove 5s infinite; /*Safari and Chrome*/
}
@keyframes boxmove
{
from {right:0px;}
to {right:200px;}
}
@-moz-keyframes boxmove /*Firefox*/
{
from {right:0px;}
to {right:200px;}
}
@-webkit-keyframes boxmove /*Safari and Chrome*/
{
from {right:0px;}
to {right:200px;}
}

و با استفاده از کد زیر آن را فراخوانی کنید:

<div class="anime"></div>

پیش نمایش:

http://rango.ir/demo/css3anim/

[lawgostar 355]

حالا چجوری توش مطلب بزارم ؟ و چجوری سرعتش کم میشه

[oMid 2114]

متن موردنظر را بین div ها قرار دهید:

<div class="anime">متن</div>

برای سرعت هم مقدارهای 5s را تغییر دهید:

animation:boxmove 5s linear;
-moz-animation:boxmove 5s infinite; /*Firefox*/
-webkit-animation:boxmove 5s infinite; /*Safari and Chrome*/

[lawgostar 355]

حالا اگر اون فلش را بخواهم کدش چیه ؟

[Saeed Fard 4740]

حالا اگر اون فلش را بخواهم کدش چیه ؟

كلاسش كه مشخص هست ، فقط بايد به جاي متن ، كد فايل فلشتون رو قرار بديد ، يا عكس يا هر چيز ديگه ..

كد فلش :

اينجا رو ببينيد ،

موفق باشيد ../.

[lawgostar 355]

منظورم این تصویری هست که توی تایپیک زیر گفتم

[Saeed Fard 4740]

پس لطفا توي يك تاپيك بحث رو ادامه بديد و گفته‌ها پراكنده نشه ..

ادامه‌ي بحث در اين مورد توي همون تاپيكي كه خودتون لينك داديد ..