Selasa, 28 Juni 2011

Membuat Textarea dengan tampilan menarik

    Cara membuatnya :
  1. Login blogger
  2. Rancangan, Edit Html, Cari kode ]]></b:skin>
  3. Dan Simpan kode berikut diatasnya :

/* Textarea CSS#
----------------------------------------------- */
textarea.css3area {
background:-moz-linear-gradient(left, #051547, #253dee, #051547, #253dee, #051547);
border: 0px solid transparent;outline: none;
border: 5px solid;
border-color: #051547 #999 #999 #051547;
border-radius: 12px;
-moz-border-radius: 12px;
-webkit-border-radius: 12px;
box-shadow: -1px -1px 1px #533801, 1px 1px 1px #533801, 1px 1px 10px #555;
-moz-box-shadow:
-1px -1px 1px #533801, 1px 1px 1px #533801, 1px 1px 10px #555;-webkit-box-shadow: -1px -1px 1px #533801, 1px 1px 1px #533801, 1px 1px 10px #555;
-moz-transition: all 1s ease-out;
-webkit-transition: all 1s ease-out;
padding: 5px 5px 2px;
margin: 20px 10px;-o-transition: all 1s ease-out;
height:200px;
width: auto;
margin-right: 5px;
color: #fff;
}
textarea.css3area:hover {
background:-moz-linear-gradient(left, #253dee, #051547, #253dee, #051547, #253dee);
border-color: #999 #888 #888 #999;
border-radius: 8px;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
text-shadow: 1px 1px 1px #aaa;
color: #fff;
box-shadow: -1px -1px 1px #533801, 1px 1px 1px #533801, 1px 1px 20px #222;
-moz-box-shadow: -1px -1px 1px #533801, 1px 1px 1px #533801, 1px 1px 20px #222;
-webkit-box-shadow: -1px -1px 1px #533801, 1px 1px 1px #533801, 1px 1px 20px #222;
height:200px;
width: auto;

}

Untuk cara memanggilnya :

<textarea class="css3area" cols="60" row="90">Masukkan teks nya disini kaw an.........Masukkan teks nya disini kawan.........Masukkan teks nya disini kawan.........Masukkan teks nya disini... </textarea>

cursor following menu

Yang kali ini saya postingkan adalah menu following cursor atau menu yang dari kata-kata nya adalah menu navigasi yang mengikuti kursor secara otomatis, selain itu juga menu ini mempunyai efek  show hide untuk menu navigasi nya, untuk demonya kawan-kawan bisa lihat pada kursor blog ini, cukup dengan mengklik Tag +menu yang mengikuti kursor  akan membuka menu navigasi yang dibuat, dan menggeser mouse untuk menutup menu show hide nya,,,, dan untuk selengkapnya bisa kawan baca di web ini malihu
semoga bisa bermanfaat untuk kalian,

cara pembuatannya pada blog klik disini