Langganan Feed

Masukkan Email Anda:

Delivered by FeedBurner

Arsip

Total Tayangan Halaman

Tampilkan postingan dengan label javascript. Tampilkan semua postingan
Tampilkan postingan dengan label javascript. Tampilkan semua postingan

Menampilkan Pop-Up pada website

Written By batikbumi on 21 Jun 2012 | 04.24

tutorial website
Pop-up dapat menjadi tempat promosi yang efektif, jika digunakan secara bijaksana, tapi jika penggunaannya terlalu berlebihan atau konten yang tampil pada pop-up kurang tepat, maka bisa jadi pop-up tersebut akan menjadi boomerang yang akan menurunkan profesionalitas website anda, karena pop-up biasanya akan mengganggu kenyamanan pengunjung website anda.
Pop-up biasanya digunakan sebagai :
  1. Media promosi bagi website anda yang lain atau bisnis anda.
  2. Menampilkan informasi bagi pengunjung website.
  3. Menunjukkan kelebihan anda dll
Beberapa hal yang menjadi pertimbangan dalam mengaplikasikan pop-up untuk website anda:
  1. Buatlah pop-up yang menarik (animasi gambar bergerak bisa beformat gif)
  2. Buat kata-kata yang menarik dan tidak bertele-tele.
  3. Usahakan agar pop-up anda memiliki loading yang cepat, agar pengunjung tidak keburu menutup pop-up sebelum pesan yang akan anda sampaikan melalui pop-up sampai kepada pengunjung website anda.
  4. Fokuskan target pop-up anda.
Berikut ini adalah code yang bisa anda gunakan untuk membuat pop-up yang akan muncul bersamaan dengan terbukanya website anda.

Masukkan script berikut diantara tag <head></head> pada dokumen HTML anda.

<script language="javascript">
<!-- Mulai
function popupWin() {
text="<html>\n<head>\n<title>Pop WIndow</title>\n<body>\n";
text +="<center>\n<br>";
text +="<a href='http://www.webAnda.com/index.html' target='_blank'><h2>disini isi web pop-up anda</h2></a>";
text +="</center>\n</body>\n</html>\n";
setTimeout('windowProp(text)', 0000); //ditunda 3 detik sebelum ditampilkan
}

function windowProp(text){
newWindow = window.open('','newWin','width=300,height=100');
newWindow.document.write(text);
setTimeout('closeWin(newWindow)', 100000); //ditunda 5 detik sebelum ditutup
}

function closeWindow(newWindow){
newWindow.close90;//tutup window pop-up
}
//akhir script -->
</script>

Kemudian pada bagian <body> anda tambahkan script berikut :

<body onload="popupWin()">

Selamat mencoba.
04.24 | 0 komentar | Read More

5 Prinsip Menggunakan JQuery UI

Written By batikbumi on 29 Mei 2012 | 04.33

Untuk memudahkan kita dalam menerapkan jQuery pada website kita, sebaiknya kita pahami lebih dulu prinsip cara penggunaan jQuery UI.
Pertama yang harus kita pahami adalah bagaimana struktur dari folder jQuery UI. Struktur folder jQuery UI adalah sebagai berikut :



Jika kita perhatikan struktur folder di atas, maka sebenarnya yang perlu diperhatikan hanya folder development-bundle, karena di dalamnya terdapat folder-folder inti jQuery UI, terutama folder ui yang menyimpan file-file library jQuery dan folder themes yang menyimpan file-file CSS.
Setelah mengenal struktur folder jQuery UI, maka kita akan lebih mudah menerapkan jQuery pada website kita, Langkah-langkahnya adalah sebagai berikut:
  1. Copy folder development-bundle ke folder utama website kita.
  2. Panggil file CSS utama jQuery UI, yaitu ui.all.css yang terdapat di folder development-bundle/themes/base/ (sesuaikan dengan folder themes) yang digunakan.
    scriptnya:
  3. <link rel="stylesheet" type="text/css"
    href="development-bundle/themes/base/ui.all.css">
  4. Panggil library jQuery UI, yaitu jquery-1.3.2.js yang terdapat di folder development-bundle.
    scriptnya:
    <script  type="text/javascript"
    src="development-bundle/jquery-1.3.2.js"></script>
  5. Panggil library utama jQuery UI, yaitu ui.core.js yang terdapat di folder development-bundle/ui/.
    scriptnya:
    <script  type="text/javascript"
    src="development-bundle/ui/ui.core.js"></script>
     
  6. Dan terakhir, panggil library komponen jQuery UI yang ingin digunakan, misalnya datepicker, yaitu ui.datepicker.js yang juga terdapat di folder development-bundle/ui/.
    scriptnya:
    <script  type="text/javascript"
    src="development-bundle/ui/ui.datepicker.js"></script>
     
 Demikian

5 Prinsip Menggunakan JQuery UI

Untuk penerapannya pada website bisa diikuti terus blog bum1.info
04.33 | 0 komentar | Read More

Pop Up Window ketika keluar dari halaman web

Written By batikbumi on 11 Apr 2012 | 08.39

pop up window ketika keluar halaman website


Berikut ini adalah salah satu cara menampilkan peringatan ketika pengunjung website/ blog anda akan keluar dari halaman website/blog. Scriptnya adalah sbb:

<html>
<head>
<title>Peringatan keluar halaman</title>
</head>
<body onUnload="alert('Terimakasih telah mengunjungi website kami')">
</body>
</html>

Ketika anda menjalankan script program di atas, maka saat anda klik tombol untuk keluar dari halaman website akan muncul pop up window seperti gambar di bawah ini:
pop up window ketika keluar halaman website
Selamat mencoba..



08.39 | 3 komentar | Read More