أحدث البرامج التعليمية وتطوير الشبكة
 

W3.CSS حي

❮ السابق التالي الفصل ❯

مع الرسوم المتحركة W3.CSS يمكنك الانزلاق وتتلاشى في عناصر HTML.







الرسوم المتحركة متعة!
الرسوم المتحركة متعة!
الرسوم المتحركة متعة!
الرسوم المتحركة متعة!
الرسوم المتحركة متعة!
الرسوم المتحركة متعة!
الرسوم المتحركة متعة!

تراجع عناصر

تراجع عنصر من أعلى، أسفل، يسار أو يمين الشاشة مع الطبقات *-W3 animate-:

صف مدرسي يعرف
W3-الأرواح أعلى ينعش عنصر 300px من الجزء العلوي من الشاشة ل0px جربها
W3-الأرواح القاع ينعش عنصر 300px من الجزء السفلي من الشاشة ل0px جربها
غادر W3-الأرواح، ينعش عنصر 300px من الجهة اليسرى من الشاشة ل0px جربها
W3-الأرواح اليمين ينعش عنصر 300px من الجهة اليمنى من الشاشة ل0px جربها

تتلاشى في عناصر

تتلاشى في عنصر مع الطبقة W3-تحريك-التعتيم:

مثال

<div class="w3-animate-opacity">..</div>
انها محاولة لنفسك »

تكبير عناصر

تكبير عنصر مع الطبقة W3-الأرواح التكبير:

مثال

<div class="w3-animate-zoom">..</div>
انها محاولة لنفسك »

عناصر تدور

تدور أي عنصر 360 درجة مع الطبقة W3-دورة:

مثال

<div class="w3-spin">..</div>
انها محاولة لنفسك »

يتلاشى اللانهائي

مثال

<div class="w3-animate-fading">..</div>
انها محاولة لنفسك »

تتلاشى جميع

مثال

<img class="w3-animate-top"    src="img_01.jpg">
<img class="w3-animate-zoom"   src="img_02.jpg">
<img class="w3-animate-left"   src="img_03.jpg">
<img class="w3-animate-bottom" src="img_04.jpg">
انها محاولة لنفسك »

❮ السابق التالي الفصل ❯