پاسخ داده شد
0
0

چطور یک انیمیشن fade in با css بسازیم؟ طوری که چند ثانیه بعد از رندر شدن المان، بصورت fade in نمایشش دهیم؟

  • شما باید برای ارسال دیدگاه شوید
پاسخ عالی
0
0

بصورت زیر می توانید انیمیشن fade in را با css بسازید:

.fade-in {
  opacity: 0; /* Initially hidden */
  animation: fadeIn 1s ease-in-out forwards; /* Apply the animation with 1s duration */
  animation-delay: 1s; /* Delay the animation start by 1s */
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

* animation-delay   تاخیر قبل از شروع انیمیشن را مشخص می کند.

*کافی است تا fade-in را به عنوان کلاس به هر المان html ای که می خواهید این انیمیشن را اجرا کند بدهید.

  • شما باید برای ارسال دیدگاه شوید
نمایش 1 نتیجه
پاسخ شما
اگر قبلاً حساب کاربری دارید با پر کردن فیلد های زیر یا به عنوان مهمان ارسال کنید.
نام*
ایمیل*
وب سایت