Postingan

Menampilkan postingan dari Februari, 2013

Notifikasi Sederhana dengan CSS3

Gambar
Hello Minna-san~ saya mau berbagi trik CSS lagi nih,Yaitu Notifikasi sederhana dengan css3,sebenarnya apasih fungsinya? awalnya juga notif ini saya gunakan untuk memberitahukan bahwa template hatsune miku sudah dapat didownload dan juga pemberitahuan bahwa template" saya sudah diupload semua ke hosting mediafire.nah karena saya cari" di google trik notifikasi yang cocok tidak ada,jadi saya membuat sendiri notifikasi ini yang merupakan hasil modifikasi dari trik " loading page dengan css3 animasi " .nah,apasih yang berbeda dengan trik loading page? bedanya,html dan css notifikasi ini pastinya lebih sederhana dan lebih minim penggunaanya,contohnya yang saya kurangi yaitu background rgba yang tadinya secara menyeluruh secara fullscreen,animasi loader/loading yang saya hapus.jadi yang tersisa hanyalah text dan background,serta css3 animasi agar setelah 10 detik,nofif ini akan menghilang secara otomatis.Oia,cssnya juga sudah saya rapihkan dari versi sebelumnya,jadi tidak...

Hatsune Miku Blogger Template

Gambar
Apa kabar sobat,tetap semangat membuat template, tidak tanggung" saya membuat video preview-nya juga saking niatnya~xD Video Preview HD: http://youtu.be/Bm-rNC9of-E DL: Download Video #Biar greget~xD Template kali ini bertema Hatsune Miku(Favorit saya~xD)(Karena saya rasa template yang dahulu kurang rapih),yang merupakan Hasil Redesign dan perkembangan dari template Metrominimalist .Dengan Design Warna Dasar Hijau cerah dan soft,dilengkapi dengan kotak search,rss,twitter dan facebook.style Post thumbnail yang sederhana,tetapi menggunakan hover efek,sehingga posting yang tadinya simple,menjadi unik dengan efek hover css3 animasinya yang soft juga.pada halaman postingnya,tidak jauh beda dengan template sebelumnya,tetapi yang berbeda yaitu related post pada template ini,menggunakan thumbnail yang sebenarnya saya temukan dari hasil browsing di google.dan ujung" sumbernya yaitu dte.web.id .Jadi Tolong jangan menanyakan ke saya ini itu tentang widget ini,tanyakan ke pembuatnya =__...

Oreshura Blogger Template

Gambar
Hello lagi minna~ hari ini saya mau share template anime tapi minimalist juga,terutama pada bagian posting dan sidebar.Tema template menggunakan warna terang dan soft ini dari anime Oreshura,atau lengkapnya Ore no Kanojo to Osananajimi ga Shuraba Sugiru yang saat ini masih ongoing,kalau sudah menonton anime ini pasti tau Natsukawa~xD ,baiklah,saya tak perlu menceritakan karekter anime tersebut,karena blog saya bukan fansub~xD. Nah,apa aja sih yang menarik dan unik dari template ini? pertama yang fitur yang belum ada pada web/blog lain yaitu posting/Sticky post dengan sytem dropdown menu .kenapa saya sebut begitu? itu karena awalnya saya mencoba" experimen menggabungkan system menu dropdown,yaitu saat kita mengarahkan kursor ke menu,maka menu akan keluar secara vertikal,nah,fungsi tersebut saya terapkan pada posting,jika kita mengarahkan kursor ke judul posting,maka akan keluar menu juga,tetapi menu tersebut juga sudah saya modif lagi terutama pada autoreadmorenya,sehingga kalau k...

Content Slider dengan CSS3

Gambar
Hai minna-san,hari ini saya mau sharing tentang Content Slider CSS3 yang sama dengan di template Fansuber Otaku ,karena ternyata banyak yang membutuhkan slider ini. Oia,Slider ini Sebenarnya hasil Editan saya,aslinya kamu bisa lihat di web ini : Iamceege.com . Apa sih bedanya? yang berbeda yang pasti stylenya,teruama pada judul slide,kecepatan animasi,jumlah photo yang ditampilkan,dan penambahan deskripsi pada slider,serta penambahan efek filter blur pada animasi.dan sebenarnya juga untuk pemasangan slider ini sudah pernah saya post pada banner lider,kalau yang itu cuma dibuat khusus agar cocok dengan banner.kelebihan dari slider ini yaitu ringan,tidak memerlukan javascript ataupun jquery,animasi dapat kita atur sendiri,dan cssnya mudah untuk disetting. CSS Buka blogger=>template=> Edit HTML, copy css dibawah ini,lalu letakan tepat diatas code ]]></b:skin> #slider3 { width: 610px; height: 298px; overflow: hidden; background-color: #fafafa; border: 1px solid #ddd; -moz-tr...