Tutorial Web Programming

Web Programming Top Contributors

Membuat Jam Digital dengan CSS3

Jam merupakan penanda waktu yang penting saat kita mengunjungi  website. Pada Tutorial kali ini kita akan membuat Jam Digital pada website kita menggunakan jQuery dan CSS3 HTML <div id="clock" class="light"> <div class="display"> <div class="weekdays"></div> ...

1
Level: Standard
Est. time: 30 min

Notifikasi Keren dengan CSS3

Notifikasi pada website merupakan hal yang penting untuk memberi tahu pengunjung website tentang informasi singkat yang diberikan oleh pemilik website, hal ini akan mempengaruhi User Xperience pengunjung saat berada pada halaman konten. Pada Tutorial kali ini, Kita akan belajar bagaimana untuk membuat beberap...

0
Level: Standard
Est. time: 30 min

Progress Bar Cantik dengan CSS3

Progress Bar adalah sesuatu yang muncul saat sedang memproses suatu konten, seperti download, upload, atau mentransfer file, pada tutorial kali ini kita akan membuat progress bar dengan tampilan yang menarik dengan menggunakan CSS3   HTML <div class="progress-bar blue stripes"> <span st...

0
Level: Standard
Est. time: 30 min

Animasi Header cantik dengan CSS3

Header merupakan bagian penting dalam website yang menunjukan judul dan jati diri pada website tersebut, pada tutorial kali ini kita akan belajar cara membuat Animasi Header yang cantik dengan CSS3, anda bisa mengambil file yang dibutuhkan di sini   HTML <div class="header"> <div clas...

0
Level: Standard
Est. time: 30 min

Membalik Gambar CSS3

Assallamualaikum... Kembali lagi bersama saya Mazhuda... :-) Pada tutorial lalu kita membahas cara membuat hover berefek putar sekarang hampir sama dengan yang lalu namun kali ini kita akan membuat rotasi putar dengan menggunakan sumbu Y sebagai sumbunya, itu berarti kita sudah membuat efek 3D... Haha... Oke sekarang langsun...

0
Level: Newbie
Est. time: 10 min

Hover Putar CSS3

Assallamualaikum... Haha... Sebenarnya ini adalah tulisan pertama saya pada situs berbagi ilmu ini :-) . Pada kali ini kita akan membuat efek hover memutarkan objek dengan memanfaatkan property transform tepatnya transform rotate untuk membuat efek berputar dan property transition untuk menentukan waktu animasi yang kita buat...

0
Level: Newbie
Est. time: 10 min

Membuat Web Chatting dengan Ajax Jquery, PHP, dan Bootstrap 2.3.2 [Part 5] (Terakhir)

ok teman-teman sampai jumpa kembali masih ditutorial yang sama, pada tahap sebelumnya kita sudah berhasil membuat mesin chattingnya, sekarang lanjut ke pembuatan emoticonnya. Emcoticon diatas kita tampilkan dengan bantuan popover bootstrap, kemudian kita meloadnya dengan javascript. buka kembali fil...

11
Level: Newbie
Est. time: 60 min

Membuat Web Chatting dengan Ajax Jquery, PHP, dan Bootstrap 2.3.2 [Part 4]

Selanjutnya adalah pembuatan fitur chatting, (bagian inti). Sekrang kita akan memfungsikan bagian form pengirim pesan, kita akan memprosesnya menggunakan ajax Pada form pesan diatas kita kembali menggunakan html5 validasi, required x-moz-errormessage="Ketik pesannya gan !" &nbsp;jadi ketika kosong maka ak...

3
Level: Newbie
Est. time: 60 min

Membuat Web Chatting dengan Ajax Jquery, PHP, dan Bootstrap 2.3.2 [Part 3]

Lanjut ke pembuatan file &ldquo;daftar.php&rdquo; yang akan memproses, request dari ajax pada tutorial sebelumnya. berikut codenya. &lt;?php session_start(); include "koneksi.php"; $nick=trim($_POST['nick']); $email=trim($_POST['email']); $pass=md5($_POST['pass']); $periksadulu=$koneksi-&gt;prepare...

1
Level: Newbie
Est. time: 75 min

Membuat Web Chatting dengan Ajax Jquery, PHP, dan Bootstrap 2.3.2 [Part 2]

pada tutorial&nbsp; sebelumnya kita sudah membuat 2 modal, yaitu modal "Masuk" dan modal "Daftar" dan pada tahap ini kita akan membuat halaman Chatroom. langsung saja kita buat halaman chatroomnya, kita masukkan kedalam function. function sudah_login(){ ?&gt; &lt;!doctype html&gt; &lt;html lang="en"...

1
Level: Newbie
Est. time: 60 min