Membuat auto penjumlahan dengan javascript

Auto penjumlahan dengan javascript. pernahkah anda melihat suatu aplikasi yang sperti ini, mungkin pada para master web tentu bukan hal yang sulit, ini saya bagikan buat sobat-sobat yang pengen tahu aja.

auto penjumlahan ini tentu sobat sudah tahu seperti apa yang saya maksud, begini saat kita mengetikkan angka pada form text field dan di form text field yang satunya, maka otomatis pada jawaban

More about → Membuat auto penjumlahan dengan javascript

membuat galeri foto efek hover dengan css

membuat galeri foto efek hover dengan css. seperti sebelumnya saya pernah posting dengan judul hampir sama yaitu membuat galeri foto dengan css, namun kali ini kita sedikit memberikan efek animasi hover nya.

trik ini sendiri sangat mudah untuk di terapkan dalam sebuah website dan blog.untuk penggunaannya sendiri itu tergantung anda.

untuk jelasnya , berikut contoh live demonya:

.hovergallery

More about → membuat galeri foto efek hover dengan css

Belajar css dan fungsi-fungsinya | bagian 1

Belajar css dan fungsi-fungsinya. Pada postingan kali ini saya akan mencoba share tentang kode css3 , kurang lebihnya seperti itu, namun pembahasan ini sendiri saya bagi menjadi beberapa bagian.
pada bagian pertama ini saya akan membahas tentang border radius.

sebelum itu tolong mengerti dulu konsep untuk menghubungkan kode css dengan html.

Jika .nama maka pada html kode pangilannya harus

More about → Belajar css dan fungsi-fungsinya | bagian 1

Membuat Menu Bundar untuk website dan blog

Membuat Menu Bundar untuk website dan blog.membuat menu dan menu lagi,hehe, gpp lah untuk mengisi waktu luang daripada habis buat facebook.hehe.

siapa tahu aja ada yang menginginkan menu seperti ini, menu ini simpel banget namun unik dan masih sangat jarang orang yang menggunakan menu seperti ini.
berikut ini contoh atau demo menu nya:


.circlemenu{
width: 100%;
overflow:hidden;
}

.circlemenu

More about → Membuat Menu Bundar untuk website dan blog

Cara Membuat css Triangle

Cara Membuat css Triangle. Triangle sendiri banyak sekali manfaatnya untuk blog, misalkan kita mau menunjukan sesuatu kepada pengunjung ,kita membuat sapaan di dalam bentuk triangle.
ada yang masih bingung apa itu triangle.
berikut ini contohnya:
contoh 1


.uparrowdiv, .downarrowdiv, .leftarrowdiv, .rightarrowdiv{
width:400px;
min-height:40px; /*min height of DIV should be set to at least 2x

More about → Cara Membuat css Triangle

Membuat bingkai Foto dengan css3

Membuat bingkai Foto dengan css. Ok sekarang saya akan share tentang cara membuat bingkai foto dengan css, ya tentu css3 ya.. tapi sebenarnya ini tidak cuma bisa di gunakan untuk foto , bisa foto + artikel , atau hanya artikel , atau lainnya  terserah anda mau menampilkan apa, namun lebih elegan aja kalau nampilin foto di blog dan website menggunakan bingkai.

.imageborder{
border-width: 20px;
-

More about → Membuat bingkai Foto dengan css3

membuat menu dengan css

membuat menu dengan css. Tertarik dengan efeknya , kali ini posting tentang membuat menu dengan css lagi deh. sebelumnya saya banyak posting tentang Cara membuat menu dengan css baik itu dropdown maupun tidak , atau vertikal dan menu horizontal. jadi postingan kali ini hanya sebagai pelengkap saja.
lihat di artikel terkait di bawah postingan ini jika anda mau menu yang lainnya.

ok sekarang

More about → membuat menu dengan css

Membuat Efek Gambar saat di sentuh

Membuat Efek Gambar saat di sentuh.Trik kali ini membahas tentang css lagi, kali ini kita akan membuat efek gambar saat di sentuh mouse. tentu efek ini sangat bagus dan elegan untuk anda gunakan di blog atau website.

seperti sebelumnya efek gambar ini hanya menggunakan kode css dan html untuk implementasinya , jadi tidak memberatkan loading blog atau website anda.
untuk lebih jelasnya berikut

More about → Membuat Efek Gambar saat di sentuh

Membuat menu vertikal animasi dengan css

Membuat menu vertikal dengan css. Oke kembali lagi kita membahas tentang menu dengan css, namun kali ini selain tampilannya yang beda dan menunya berbentuk vertikal. sebelumnya saya banyak posting tentang menu horizontal dengan css , ada juga yang menggunakan javascript.

balik ke pokok postingan kali ini, kita akan membuat vertikal menu yang ada efeknya menggunakan css3.
untuk lebih jelasnya

More about → Membuat menu vertikal animasi dengan css

membuat slide keterangan gambar animasi

Kembali lagi membahas tentang kode css, Namun kali ini kita akan membuat slide keterangan gambar.
Sebuah gambar yang ada pada website tentu memiliki title atau keterangan untuk menjelaskan apa maksud gambar tersebut, tentu secara standar keterangan gambar hanya biasa2 saja.

pada trik ini kita akan membuat keterangan gambar keluar secara slide dari bawah gambar dengan animasi yang elegan dan

More about → membuat slide keterangan gambar animasi

membuat menu website dengan css

membuat menu website dengan css.Kembali lagi membahas tentang Membuat menu dengan css, Tentu kali ini tampilannya dan efeknya yang beda.
Menu ini bisa di bilang sangat elegan dan animasi karena efek transparan saat di sentuh mouse.
Untuk lebih jelasnya , berikut ini contoh menu nya:

div.bottombar{ /* bar that runs across the bottom of the menu */
height: 10px;
background: #1a1109;
}

More about → membuat menu website dengan css

Membuat menu efek dengan css

Trik Kali ini Adalah Membuat Menu animasi dengan css. Menu ini sangat ringan karena hanya menggunakan css untuk membuat animasi efek yang ada pada menu.

Menu ini sendiri bebas anda gunakan di mana saja , baik itu website, blog dll.
untuk lebih jelasnya berikut ini contoh menunya, ini sengaja tidak saya buat dropdown, jika anda menginginkan menu dropdown, sebelumnya saya banya posting tentang

More about → Membuat menu efek dengan css

membuat loading efek dengan css3 dan javascript

Membuat animasi loading pada website dan blog, Pada beberapa website banyak yang membutuhkan loading page seperti ini, pada blog juga bisa kita terapkan misalnya sebagai awalan sebelum halaman blog terbuka.
kali ini saya akan share cara membuat loading keren untuk blog dan website menggunakan css dan javascript. tapi tenang , caranya gax ribet koq.

sebagai contoh di bawah ini contohnya:



$

More about → membuat loading efek dengan css3 dan javascript

Cara membuat text warna berjalan

cara membuat text warna berjalan.Trik kali ini adalah membuat gaya animasi text yang gelap menjadi terang, hehe..
bingung ya..susah si ngejelasinnya.
dari pada bingung sendiri mending demo aja ya.  nah berikut ini demonya.

var message="Selamat datang di Top dan Unik"
var neonbasecolor="gray"
var neontextcolor="red"
var flashspeed=100 //in milliseconds

var n=0
if (document.all||

More about → Cara membuat text warna berjalan

membuat text efek rainbow

Sebelumnya saya sudah posting tentang membuat text gaya gelombang kali ini saya akan mencoba share tentang membuat text efek rainbow. tahukan seperti apa efek rainbow itu, hmm bisa di bilang efek pelangi.

untuk lebih jelasnya di bawah ini demonya:


var text="Contoh Text Efek RAINBOW" // YOUR TEXT
var speed=80 // SPEED OF FADE

if (document.all||document.getElementById){
document.write('' + text

More about → membuat text efek rainbow

Membuat text gaya gelombang dengan javascript.

ok..postingan kali ini kembali lagi ke kode-kodean, sebelumnya saya share tentang css3 dan sekarang mencoba share tentang javascript.
trik kali ini adalah membuat text dengan gaya gelombang.jika sobat penasaran seperti apa yang akan kita buat, berikut contohnya, bukan gambar lo tapi text yang kita ubah dengan javscript.



var fs=1
var direction="right"
function rollertext(whichone){
var thetext=

More about → Membuat text gaya gelombang dengan javascript.

Membuat galeri foto dengan css

Membuat galeri foto dengan css. oke kembali lagi membahas tentang css, trik kali ini adalah membuat galeri  foto untuk website dan blog.

galeri foto sendiri banyak sekali manfaatnya, dan buat anda yang mau menambahkan galeri foto di website atau blog silahkan di praktekkan cara berikut ini.
sebelumnnya , silahkan lihat contoh berikut ini:

.zinto {
background-color: #BBB;
border:1px solid #FFF;

More about → Membuat galeri foto dengan css

Membuat spoiler animasi dengan css3

Membuat spoiler animasi dengan css3. kali ini saya akan share tentang membuat spoiler animasi yang mana saat mouse di arahkan ke tombol maka box spoiler akan terbuka secara otomatis.

trik ini sangat berfungsi saat kita mau posting kode yang banyak atau apapun yang ingin kita sembunyikan agar konten terlihat rapi.
Untuk contohnya silahkan lihat demo di bawah ini, coba anda arahkan mouse anda ke

More about → Membuat spoiler animasi dengan css3

membuat foto terpecah saat di klik

Cara membuat foto terpecah saat di klik. Trik ini juga tidak kalah kerennya dari trik-trik sebelumnya.
kali ini kita akan membuat foto terpecah belah saat foto tersebut di klik.
memang keren juga trik ini kalau kita terapkan di website atau blog.

Untuk contoh atau demonya ,silahkan lihat demo di sini :  DEMO

Sekarang lanjut ke caranya: silahkan gunakan kode di bawah ini untuk membuat efek

More about → membuat foto terpecah saat di klik

Cara membuat efek gambar berputar

Cara membuat efek gambar berputar. Trik berikut ini adalah bagaimana cara membuat efek gambar berputar dengan bantuan css3, tentu animasi ini sangat penting jika kita lihat dari sisi tampilannya.efek gambar berputar ini tidak terlalu banyak kode, jadi di jamin tidak memberatkan template atau tema website anda.
berikut ini contoh atau demonya, coba anda arahkan mouse anda ke gambar cewek di bawah

More about → Cara membuat efek gambar berputar