Melengkapi Website Dengan Jam Analog Pribadi

Jam adalah salah satu hal penting bagi pengunjung website untuk memantau berapa lama sudah berselancar internet atau bahkan hanya untuk sekedar mengingatkan waktu. Flash adalah salah satu solusi untuk membuat jam analog terlihat lebih indah, walaupun javascript juga dapat membuat jam analog, tapi menggunakan flash akan jauh lebih menarik dibandingkan javascript, semuanya tergantung kreatifitas designer.

Langkah-langkah membuat jam analog:

  1. Design lah dua buah gambar, satu untuk latar jam dan satu lagi untuk jarum jam, anda juga dapat menggunakan aplikasi flash langsung untuk mendesignnya namun photoshop adalah ahlinya dalam mendesign, contohnya seperti gambar dibawa ini:

Latar.png                                  Jarum.png

  1. Lalu buka macromedia flash anda dan buat lembar kerja baru
  2. Buatlah 5 layer dengan nama, (latar, perintah,jarum_jam, jarum_menit, jarum_detik) seperti yang terlihat pada gambar ini:
  1. Kick File > New > Import to Library untuk memasukkan dua gambar yang telah disebutkan diatas, lalu tekan Ctrl+L untuk menampilka library.
  2. Klick frame 1 pada layer latar dan drag gambar yang dijadikan untuk background/latar
  3. Klick pada lembar kerja kosong dan sesuaikan ukuran lembaran kerja pada bagian properties, disini saya set ukuran menjadi 192 X 170, sesuai dengan ukuran gambar latar yang saya gunakan
  4. Klick frame 1 pada layer jarum_detik dan drag gambar yang digunakan untuk jarum, klick hasil drag anda dan tekan F8 untuk mengubahnya menjadi symbol, beri nama dengan jarum dan pada bagian Registration pilih bagian tengah bawah yang akan dijadikan poros putaran jarum, lihat gambar dibawah ini:
  1. Geser gambar jarum kebagian tengah gambar dan beri nama Instance Name dengan detik
  2. Klick frame 1 pada layer jarum_menit lalu drag simbul jarum yang telah kita buat tadi, buat ukuran tingginya sedikit lebih pendek dari detik, beri nama Instance Name dengan menit
  3. Klick frame 1 pada layer jarum_jam lalu drag simbul jarum yang telah kita buat tadi, buat ukuran tingginya sedikit lebih pendek dari menit, beri nama Instance Name dengan jam
  4. Klick frame 1 pada layer perintah dan masukkan kode dibawah ini:

time=new Date();

d = time.getSeconds()

m = time.getMinutes()

j = time.getHours()

j = j + (m/60);

d = d*6;

m = m*6;

j = j*30;

detik._rotation=d;

menit._rotation=m;

jam._rotation=j;

  1. Lalu tambahkan frame kosong pada frame 2 pada tiap-tipa layer, tekan F5 untuk menambahkan frame.
  2. Simpan project anda dengan nama jam.fla dan tekan Ctrl+ENTER untuk melihat hasilnya sekaligus menciptakan file *swf dalam folder dimana anda menyimpan project tersebut.
  3. untuk menggabungkannya dengan tag html gunakan tag :

<embed src=jam.swf>

Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s


%d blogger menyukai ini: