ladybug animation
TRANSCRIPT
05/0
1/20
23M
CC-1
1-01
TEL
KOM
APP
LIED
SCH
OO
L
LADYBUG ANIMATIONTOMMY ALHAMRA [30111490]WILDAN ABDUL MAJID [30111494]ARIYA YONDA DESTANTO [30111493]
1
05/0
1/20
23M
CC-1
1-01
TEL
KOM
APP
LIED
SCH
OO
L
Tampilan animasi kumbang yang berputar (berotasi)
TAMPILAN
2
05/0
1/20
23M
CC-1
1-01
TEL
KOM
APP
LIED
SCH
OO
L
STRUKTUR HTML PADA BODY
3Animasi ini full menggunakan css.
Pada Html hanya memanggil dari css
05/0
1/20
23M
CC-1
1-01
TEL
KOM
APP
LIED
SCH
OO
L
Dikarnakan kami mencoba animasi ini lewat browser crhome maka yang diedit untuk menggerakan animasi menggunakan @-webkit, jika mozila edit yang @-moz. Animasi bisa bergerak dikarnakan adanya keyframe. Dimulai
dititik 12% sampai 100% dan adanya koordinat
4
CARA MEMBUAT ANIMASI BERPUTAR
05/0
1/20
23M
CC-1
1-01
TEL
KOM
APP
LIED
SCH
OO
L
MEMBUAT SAYAP BEGERAK
5Membuat animasi sayap kiri bergerak
05/0
1/20
23M
CC-1
1-01
TEL
KOM
APP
LIED
SCH
OO
L
MEMBUAT MATA BERKEDIP
6Membuat animasi mata bergerak
05/0
1/20
23M
CC-1
1-01
TEL
KOM
APP
LIED
SCH
OO
L
MEMBUAT KAKI BERGERAK
7Membuat kaki depan bergerak
05/0
1/20
23M
CC-1
1-01
TEL
KOM
APP
LIED
SCH
OO
L
STRUKTUR CSS
8
05/0
1/20
23M
CC-1
1-01
TEL
KOM
APP
LIED
SCH
OO
L
STRUKTUR CSS
9
*begitu juga dengan sayap kanan menggunakan css yang sama
05/0
1/20
23M
CC-1
1-01
TEL
KOM
APP
LIED
SCH
OO
L
STRUKTUR CSS
10
*begitu juga dengan mata kanan menggunakan css yang sama
05/0
1/20
23M
CC-1
1-01
TEL
KOM
APP
LIED
SCH
OO
L
STRUKTUR CSS
11
*begitu juga dengan kedipan mata kanan menggunakan css yang sama
05/0
1/20
23M
CC-1
1-01
TEL
KOM
APP
LIED
SCH
OO
L
STRUKTUR CSS
12
*begitu juga dengan bola mata kanan menggunakan css yang sama
05/0
1/20
23M
CC-1
1-01
TEL
KOM
APP
LIED
SCH
OO
L
STRUKTUR CSS
13
*begitu juga dengan kaki tengah dan kaki kiri menggunakan css yang sama
05/0
1/20
23M
CC-1
1-01
TEL
KOM
APP
LIED
SCH
OO
L
LADYBUG ANIMATION
14https://developer.mozilla.org/en-US/demos/detail/ladybug
*jika ingin mencoba aplikasi dari mozila silahkan kunjingi situsnya dan download source codenya
05/0
1/20
23M
CC-1
1-01
TEL
KOM
APP
LIED
SCH
OO
L
Terimakasih
15