Penggunaan HTML5 dan CSS3 pada Aplikasi Mozila Developer
•Download as PPTX, PDF•
0 likes•630 views
Dibuat oleh M Arif Gusti Putra, Putu Agus Wibawa, Benedicta Ganjar Lestari
More Related Content
Viewers also liked
Viewers also liked (20)
Recently uploaded
Recently uploaded (20)
Penggunaan HTML5 dan CSS3 pada Aplikasi Mozila Developer
- 3. • Pada kodingan yang terdapat di dalam tag <head> terdiri dari 2 komponen 1. <style> adalah tag css yang digunakan untuk pengaturan body halaman dari website. Disini dilakukan pengaturan berupa warna background dari website, warna tulisan, jenis/ font tulisan, ukuran tulisan, teks dekorasi, dll 2 <script src="processing.js“ type="text/javascript"> : adalah pemanggilan source kode yang bertipe java script yang bernama processing.js
- 4. • Pada tag <body> terdapat 2 komponen. 1. Pemanggilan pada sebuah div yang bernama “content” 2. Di dalam div content terdapat pemanggilan 2 div yang lainnya. A. <div style="text-align: center"> digunakan untuk melakukan pengaturan bahwa posisi dari obejek yang akan dibangun web berada pada posisi tengah. B. <canvas id="clock" data-processingsources="clock.pde" width="700" height="700"> adalah pemanggilan tag canvas dengan id “clock” dimana source nya bernama “clock.pde, ukuran dari canvas itu sebesar panjang 700 dan lebar 700
- 5. Membuat sebuah class void setup(), berisi sebuah objek dengan ketentuan: Ukuran 700x700 Tanpa garis, dengan background putih Perintah untuk memanggil gambar2 ke dalam class void setup(). Dengan ketentuan: Nama_variabel=loadImage(“namagambar.p ng”) Dial.resize(width,height) adalah agar gambar dapat menyesuaikan dengan ukuran objek (700x700)
- 6. Membuat sebuah class void draw(), berisi sebuah objek dengan ketentuan: Diisi warna putih Jarak antar objek, panjang dan lebarnya 0px 0px Membuat text dengan tulisan “Jubin C Jose”, dengan ukuran font 32 Translate -> memposisikan agar tulisan terletak di tengah Memanggil pengaturan jam pada setting pc Membuat variabel h: untuk memanggil jam Membuat variabel m: memanggil menit Membuat variabel s: memanggil detik
- 7. Memanggil class resetMatrix() . Calss ini dijalankan, dan terdapat di script processing.js Float hrs = pengaturan perputaran jarum jam Traslate= memindahkan objek ke posisi 0px dari kiri (x), dan 100px dari atas (y) Rotate(hrs) = css untuk memutar objek yang menunjukan jam Rect mengatur jarak (atas, kanan,bawah,kiri) Memanggil class resetMatrix() . Calss ini dijalankan, dan terdapat di script processing.js Float min= pengaturan perputaran jarum menit Traslate= memindahkan objek ke posisi 700px/2 dari kiri (x), dan -700px/2 dari atas (y) Rotate(hrs) = css untuk memutar objekyang menunjukan jam Rect mengatur jarak (atas, kanan,bawah,kiri)
- 8. variabel a mendapat element ID dengan nama my canvas variable ctx yang dideklarasikan dengan nama a bertipe 2d rectangle yang dibuat berwarna putih x,y,panjang ,lebar karena kodingannya memiliki banyak baris dan merupakan pengertian yang sama dengan baris diatas maka kami mendeskripsikan cntoh baris yg paling atas.