ساخت انیمیشن (Animation) به صورت ظاهر شدن تدریجی عنصر (انیمیشن Fade in)، با کلاس w3-animate-opacity ، در W3.CSS
با استفاده از کلاس w3-animate-opacity در چارچوب W3.CSS ، می توانیم یک انیمیشن (Animation) به صورت ظاهر شدن تدریجی عنصر (انیمیشن Fade in) بسازیم.
برای این منظور، کلاس w3-animate-opacity را به صورت زیر برای عنصر مورد نظر ذکر می کنیم :
ظاهر شدن تدریجی عنصر بر اساس تغییر تدریجی شفافیت عنصر از 0 به 1 در مدت زمان 0.8 ثانیه می باشد (میزان شفافیت به اندازه 0 به معنای کاملا ناپدید شدن عنصر و میزان شفافیت به اندازه 1 به معنای نمایش کامل عنصر بدون هیچگونه شفافیت می باشد).
به مثال زیر توجه کنید :
بخش مهم کدها :
کد کامل صفحه HTML :
نتیجه :
این صفحه را دوباره اجرا کنید تا چگونگی نمایش انیمیشن (Animation) در ابتدای بارگذاری صفحه را مشاهده نمایید :