Lagi ada tugas nih, boss maunya yang aneh-aneh saja. Padahal saya kan baru di bidang ini. Boss maunya dialog box/modal box layer style, maksudnya di dialog box itu kita tampilkan file .php dengan ajax. Pernah sih lihat web dengan tampilan seperti itu, tapi scriptnya di compress, jadi susah deh bacanya.Mau bikin sendiri, kayaknya susah banget deh. Mendingan tanya ama profesor GOOGLE, pasti dia tau. Setidaknya ada petunjuk dikit ato contoh ato script gratisan hehehehehhee.......
Akhirnya dapet juga, yang ini gratis lho
http://www.wildbit.com/labs/modalbox/
tampilannya juga lumayan, ada transisinya, overlay opacity juga bisa diatur
cara pakainya juga gampang
- Tambahkan file javascript di bawah ini di halaman anda:
<script type="text/javascript" src="includes/prototype.js"> </script>
<script type="text/javascript" src="includes/scriptaculous.js?
load=effects"></script>
<script type="text/javascript" src="includes/modalbox.js"> </script> - Tambahkan file css berikut
modalbox.cssdi halaman anda:
<link rel="stylesheet" href="includes/modalbox.css" type="text/css"
media="screen" /> - Contoh simple, misalnya anda ingin membuat konfirmasi pada saat menghapus sesuatu :
Modalbox.show('<div class=\'warning\'><p>Are you sure to delete this¬
item?</p> <input type=\'button\' value=\'Yes, delete!\'¬
onclick=\'Modalbox.hide()\' /> or <input type=\'button\'
value=\'No, leave it!\' onclick=\'Modalbox.hide()\' /></div>',¬
{title: this.title, width: 300} - Contoh simple, misalnya anda ingin menampilkan file anda pada dialog box tersebut :
<a href="_ajax_form.html" title="Modalbox without transitions" ¬
onclick="Modalbox.show(this.href, {title: this.title, transitions: false}); ¬
return false;">Modalbox with ajax</a>
Selamat mencoba