Baik, saya sekarang akan membuat sebuah website yang full dengan konten flash, sehingga hanya sedikit komponen HTML-nya.
- Siapkan sebuah dokumen flash baru menggunakan Flash CS 3, karena kita perlu Flash Player 9 untuk agar dapat fullscreen pada browser.
- Atur ukuran dari stage menjadi 640 piksel x 480 piksel. panel properties
- Gambar 4 buah teks agar berguna sebagai link, yaitu : home, project, link, about me. menu
- Tulisan tersebut masih berupa teks, sekarang kita ubah menjadi button, sehingga semua terdapat 4 button. Klik kanan pada masing-masing teks, pilih Convert to Symbol, pilih button dan klik OK. Convert to Symbol
- Setelah itu klik 2 kali pada tombol yang baru saja dibuat, tambahkan area pada frame hit. Gunanya adalah agar ketika mouse memasuki area tersebut, maka tombol akan bisa di-klik. Masuk ke dalam Button
- Setelah sudah, klik 2 kali pada area kosong untuk kembali ke stage. Terapkan teknik tersebut ke masing-masing teks menu.
- Beri instance name masing-masing tombol yang telah dibuat seperti gambar ini. Memberikan instance name, cukup klik pada button tersebut dan tekan Ctrl + F3untuk menampilkan panel properties. Instance Name
- Buatlah sebuah kotak berukuran 2400 piksel x 350 piksel pada stage pada posisi x = 20 dan y = 70. Bagi menjadi 4 bagian, sehingga per bagian memiliki panjang 600 piksel.
- Seleksi kotak tersebut, dan klik kanan kemudian pilih Convert to Symbol pilih MovieClip. Pastikan titik registrasi berada di kiri. Convert to Movieclip
- Jangan lupa untuk mengganti instance name-nya menjadi kotak_mc. kotak_mc
- Sekarang, masuk ke dalam kotak tersebut, dan kita edit bagian dalamnya
, kira2 seperti ini :
Preview - Sekarang buat sebuah tombol untuk fullscreen. Beri nama fullscreen_btnsebagai instance name-nya. tombol fullscreen
- Sekarang lanjut ke script (actionscript 2.0). Buat sebuah layer baru, klik pada frame 1, tekan F9 untuk memunculkan panel Actions – Frame. Ketik syntax berikut :
import mx.transitions.Tween; import mx.transitions.easing.*; tombol1_btn.onRelease=function(){ var myTween:Tween = new Tween(kotak_mc, "_x", Strong.easeOut, kotak_mc._x, 20, 1, true); } tombol2_btn.onRelease=function(){ var myTween:Tween = new Tween(kotak_mc, "_x", Strong.easeOut, kotak_mc._x, -580, 1, true); } tombol3_btn.onRelease=function(){ var myTween:Tween = new Tween(kotak_mc, "_x", Strong.easeOut, kotak_mc._x, -1180, 1, true); } tombol4_btn.onRelease=function(){ var myTween:Tween = new Tween(kotak_mc, "_x", Strong.easeOut, kotak_mc._x, -1780, 1, true); } fullscreen_btn.onRelease=function(){ //fullscreen di projector //fscommand("fullscreen","true"); //fullscreen pada browser Stage.displayState="fullScreen"; }
- Kemudian buka publish setting pada Menu File -> Publish Settings, pastikan pengaturan seperti pada gambar. Publish Settings
- Kemudian klik Publish agar file Html dan .swf terbentuk.
- Untuk demo silakan lihat di sini : Link
0 comments:
Post a Comment
Tidak boleh spam
tidak boleh ceplas ceplos
berkomentarlah dengan baik, karena kriteria orang bisa di nilai dari apayang dia komentari :)