مهمان عزیز خوش آمدید. ورود ثبت نام



امتیاز موضوع:
  • 1 رای - 5 میانگین
  • 1
  • 2
  • 3
  • 4
  • 5

[-]
کلمات کلیدی
آموزش انیمیشن در css سری 2

آموزش انیمیشن در CSS سری 2
سلام دوستان

سری دوم این آموزش بر روی <div> مورد نظر هست

توضیحات لازم در سری 1 داده شده - رفتن به آموزش سری اول

استایل:
کد پی‌اچ‌پی:
<style
div
{
    position:relative;
    width:200px;
    height:200px;
    font-family:TahomaGenevasans-serif;
    font-size:14px;
    text-align:center;
    padding:10px;
    background:#09F;
    animation-delay:0s;
    animation:myfirst 8s;
    animation-iteration-count:50;
    -webkit-animation-delay:0s;
    -webkit-animation:myfirst 8s;
    -webkit-animation-iteration-count:50;
}

@
keyframes myfirst
{
0%   {background:#09F; left:0px;}
25%  {background:#39C; left:800px}
50%  {background:#C06; left:100px;}
75%  {background:#999; left:50px;}
100% {background:#09F; left:1px;}
}

@-
webkit-keyframes myfirst
{
0%   {background:#09F; left:0px;}
25%  {background:#39C; left:800px}
50%  {background:#C06; left:100px;}
75%  {background:#999; left:50px;}
100% {background:#09F; left:1px;}
}

</
style

کد فراخوانی :
کد پی‌اچ‌پی:
<div></div
یا
کد پی‌اچ‌پی:
<div>مای بی بی آی آر</div
کد :
کد پی‌اچ‌پی:
animation-iteration-count:50
برای تعیین تعداد اجرا هست

تشکر و اعتبار یادتون نره

نمونه و کد آماده :

.html   Animation_2.html (اندازه 1.13 KB / تعداد دانلود: 25)
 

 


تصویر: https://pardazit.net/images/pardazit.net-468-60.gif
پاسخ


موضوعات مشابه ...
موضوع نویسنده پاسخ بازدید آخرین ارسال
  آموزش ساخت گالری با css ERFAN-DESIGN 10 1,072 ۲۶ بهمن ۱۳۹۴، ۰۱:۲۳ ق.ظ
آخرین ارسال: Tofighi
  آموزش کامل Border-Radius mhdbadboy 0 641 ۰۵ اردیبهشت ۱۳۹۳، ۱۲:۴۷ ب.ظ
آخرین ارسال: mhdbadboy
Thumbs Up آموزش گردکردن عکس behnam 1 1,116 ۲۲ شهریور ۱۳۹۲، ۱۲:۵۰ ب.ظ
آخرین ارسال: rahnamafard
  آموزش بکگراند متحرک (انیمیشن با CSS) ••CentOS•• 0 1,518 ۲۱ شهریور ۱۳۹۲، ۱۰:۰۹ ب.ظ
آخرین ارسال: ••CentOS••
  آموزش انیمیشن در CSS ••CentOS•• 2 1,709 ۱۹ شهریور ۱۳۹۲، ۰۷:۰۸ ب.ظ
آخرین ارسال: ••CentOS••
Star آموزش گرد کردن تصاویر با استفاده از css KoG 0 2,113 ۰۹ تير ۱۳۹۲، ۰۴:۵۶ ب.ظ
آخرین ارسال: KoG
  آموزش Blur کردن متن با css KoG 0 1,430 ۰۹ تير ۱۳۹۲، ۰۴:۴۳ ب.ظ
آخرین ارسال: KoG

پرش به انجمن:


کاربران در حال بازدید این موضوع:

1 مهمان


درباره‌ی ما

گروه پشتیبانی فارسی مای بی بی My-BB.Ir در واپسین روزهای پاییز 1391 کار خود را در زمینه مای بی بی آغاز کرد. این گروه با توکل بر خدای منان و دانش فنی خود در تلاش است فعالیتی هرچند ناچیز در زمینه ارتقا و پشتیبانی مای بی بی انجام دهد.
تمامی حقوق برای وب‌سایت پشتیبانی فارسی مای بی‌بی (My-BB.Ir) محفوظ می‌باشد و هرگونه کپی‌برداری از آن شرعا حرام و قانونا غیرمجاز می‌باشد.
قدرت گرفته از مای بی‌بی - فارسی‌ساز: My-BB.Ir و IORA.Ir