Dump Dumb: November 2011

Back To Top on Blog!

Posted In Tips and Trick - 19.09 - 0 komentar

Back To Top adalah button yang bisa mengembalikan kita ke halaman paling atas secara otomatis

Langkah 1:
Buka Dashboard -> Layout -> Edit html
Temukan script di bawah: [ctrl+f]

]]></b:skin>

Apabila sudah menemukannya, tambahkan script di bawah ini, di atas script tadi:

#backtotop {
padding:5px;
position:fixed;
bottom:10px;right:10px;
cursor:pointer;
}

Langkah ke 2:
Temukan script di bawah: [ctrl+f]

</body>

Apabila sudah menemukannya, tambahkan script di bawah ini, di atas script tadi:

<a href="#" id="backtotop"><img src="Image-Url" alt="back to top" /></a>

Ganti Image-Url ke alamat model button yang di inginkan
------------------------------------------------------------------------------

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj100gKJDTkhCrNglCNGrSLfipPJgv89aFHXoMTF5hatj-BfWMDKiTuzE2UXVpeMNWvsymX8NxfLxPzE7cZt9m0zag8RuahYP6Mh_wg5d44hyphenhyphenbDwFfbM6K9DnFLbo4n6DH6Pt48sPuQLS9F/s1600/bttp-5.png

------------------------------------------------------------------------------

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-9Na_AqJdXlMEYpASp9A4oVsrWRJez8FaPvOKZ5k3NhFbibqfszv0eg6fBOwif7QGHjFFjbET49rYS_hkSnw_jEIATGcQ3Fk1mndyp2vWR0rFa6WQI4X_Ri1Jp5r7IuvHW5l21Xrw8GMl/s1600/bttp-4.png

------------------------------------------------------------------------------

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWmAxcQ_TB7N6NH37IRafw3QTP3nMeXJEoRbdbRGdIlVcUJ72a7q7G3fvajmhUyTXMe_C_aDWgQGCiwsvEaJl02R6wuuNuVmEdjyE7IN_n-MMBW1ani6ZV57b2fyL-8dGqWPEXmoXL6_4A/s1600/bttp-3.png

------------------------------------------------------------------------------

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKLS2Yq89Zc1J0_VjaPDtmaRFlH_Qqs9h_0g_YCbhD9l06pJvHiWpe-3jxR51pDM0yvMisBsPakW7EDu4VWAKNlMJFRwEB1d9r_A09VftSv2k10fB3V4g4L76lzMg_0ZDCjxUKrI38lk6L/s1600/bttp-1.png

------------------------------------------------------------------------------

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9RAEIe0kF-kVo4PkG1T6vdLZECA4RNjw7dZ0end0PrNvK4GPnvFxODYqIKvTirMzEFph2bcH90CuHl4ftHJnyi10LF0Yh9uKGYq9o2fhYBXrSjZTD2hmhUOywWud7DQk_vXooOJa-vjCu/s1600/bttp-2.png

------------------------------------------------------------------------------

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhO6amkq_zh0-F6OjqeK4xXFtgv_Zp8SOFBk4nt9ZYshfMibMhcGI1RuGbkdcZEi__DG8ddHxuR159qpjbHI6XBhzxk_EdHiFlVjSZ0roY4Vc91umLIgzE9DgfQA2_PAtrq4zt4wne3mosG/s400/bttp-10.png

------------------------------------------------------------------------------

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiASE8XP4HhxeQlHhnVlM_3nzUbFWP9VCZ1oSvDbmyYvNXKk0Qc9oD9SySoO6gDBjMWondZcM9THEw0O7xOnGFeNuTDzxYNe16TNbVKX8V48egQ1nyJCJKi03fiC6ksvVgxN4AMB1OdNie8/s400/bttp-9.png

------------------------------------------------------------------------------

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgdtFNMKZBPmvpqF45Ccf-fKYlD6AmrPy0NL6BniERWns8Sk2nskL3q2EMdGXVcsC6E_tTBYq6A2_cWQqLM2_BNGFo4WJb0t6idIsnST20mIncvFe1YbYp_qWRriXhyphenhyphenHridDoF8AUmKEJcU/s400/bttp-8.png

------------------------------------------------------------------------------

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBDBghpWj3qx-N-GZK_pxVMGh8ZQGYISjz5ymDizeLd8JJcRna_tKMj4nGnaNd-q5DGA9sYtRNYwYnDLv1dKcoOHSPi6f8voEfEKur0gJGrPDhxmDhzTwbnqCG_T1_veYyW4fmuExEHDLm/s400/bttp-11.png

------------------------------------------------------------------------------

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZNrGVoMPrmwABKFwAB2KlJ_LEHIwXzTgexMWIv6PdNzhyphenhyphenckoVT2ohXAAshOCgisT4iJW9vWBQSP4pH-53-cvIEM0oSq55MgBkZddk0mdoen6W_G2SELTCyG0dQMPOou0qpvnVYEmpRb_X/s400/bttp-12.png

------------------------------------------------------------------------------

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhm_BxPDf1F6GQRDFmH6X_gcEGqrg-Rjnvlmsj_fRhHki_5nQ6at4aMv2M0ET2fIwcjfTShGnPwrJ2VMDix6zjXCHRLAoU8YXXHG2fgPTow0Hq_N8s9qtP11Eld_F4AABVa9UnP-2-TZlH2/

------------------------------------------------------------------------------

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgs_LSE0G1UEEhfvlJqu6gpsJXQISQApS-Cx5oMgotD3XJe5yRCPPCaM4gP47CPl91lnXCBDb5xawBa3APBVsHULYUsvpqamSq4iT3spwTvBse-TY0N0rioxnoHyVS9mWDvz7Z7wDnp3G2n/s400/bttp-13.png

------------------------------------------------------------------------------

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhshJG9GE2jB9rr9MQCzGNgPkMc753fOwZV3UZpnJKx62hYm0wU1e-gGV2ZBlfNJc5IwkNRug1Pn57-WLpAPj6icFdmOtlx91hMdHaNGhwDuElRTo3veQQ6CxkBSnjHvjCo6ptBrpCWHN1k/s400/bttp-14.png

------------------------------------------------------------------------------

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8YcI-dss_PUE5BeZAt_eZL5C8dlFa8uNzc4pRhKM2xdzCeYOkIov82pW-ZrOQ-8dyHDslfR_Oqw1W00n45eW0ygfdLAxhjkyrvA9Kghq84JNJYSBxxJUk2gHMn-j8FsTgBMrwuC3VDrmY/s400/bttp-15.png

------------------------------------------------------------------------------

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIGx9ICz2E0tih7q1wtDO7nKWQCaCfack4adR3jfzUaN5jlGNbEMItZAZk1K9Q5_2G6PdzXR7zo5qc3wGbiuWO8rm6hfq_bxT7g8ignWoXkeBK5fAdkkWii8lJvvHbpidsFkCawNdmtTBH/s1600/bttp-16.png

------------------------------------------------------------------------------

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKt4BgOdqSslp338zzTdZ5t0LX0KApJcH_gcANrP3zkFrIhvPu9bKrHlqWoL0FTvRLvJDCL0_D9RPvo2Itw6u7QRUDyylsiZmmpEVePU_lK53GNJ5ba_QtvFWpMZx7lw89WpaP1btaYtC0/s400/bttp-17.png

------------------------------------------------------------------------------

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAHQx0PRh8KSLrXRWzNaV97WxejL9OASy0DtWgUYBJUq7_PSXlO4DGtFU5tddTW0timwYWB3PDqk0poWXZpkvjTAdN_Z6e3ytT-89CLQ-DgOTsMdx4tKQGd7Szx-WtL5PABmAqWtew8sz_/s400/bttp-19.png

------------------------------------------------------------------------------

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgrWcUJuSvL8SGPpp0sq9bvVDNxBkOUpRe4GWl7xG8D5YELulBWIKxqOvsRzT8xtwDVYybS4mC7rfvf81y1yKopFNhPoZGP5zKYxczYyx46nue3PkBc6U2K08giCkJK4KLDxZRxHHkzzJuT/s400/20.png

------------------------------------------------------------------------------

Setelah mengganti Image-Url dengan gambar yang di inginkan akan terlihat seperti contoh di bawah ini:

<a href="#" id="backtotop"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgrWcUJuSvL8SGPpp0sq9bvVDNxBkOUpRe4GWl7xG8D5YELulBWIKxqOvsRzT8xtwDVYybS4mC7rfvf81y1yKopFNhPoZGP5zKYxczYyx46nue3PkBc6U2K08giCkJK4KLDxZRxHHkzzJuT/s400/20.png" alt="back to top" /></a>

Langkah 3:

Temukan script di bawah: [ctrl+f]

<head>

Dan paste script di bawah ini setelah script di atas:

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js'
type='text/javascript'></script>
<script language="javascript"> $(window).ready(function(){ $('#backtotop').click(function(e)
{ e.preventDefault(); $('html, body').animate({scrollTop:0}, 'slow'); }); }); </script>

kemudian pilih Save Template

Selesai

sumber

Cinemagraph: Tutorial

Posted In Photograph - 09.23 - 0 komentar

Tools:
- Kamera video
- Tripod
- IDE!
- Model/benda
- Komputer
- Photosop CS4/CS5. yang penting ada fitur File > Import > Video Frames to Layers.

------------------------------------------------------------------------------

Langkah 1
Rencanakan yang ingin anda rekam
- Kita ingin dapatkan efek "WOW, GAMBARNYA GERAK!"
- Selain bagian yang bergerak, kita ingin sebagian besar gambar tetap diam
- Pikirkan gerakan yang bisa di-loop

Contoh:
- Daun yang tertiup angin
- Orang berkedip

------------------------------------------------------------------------------

Langkah 2

Setelah selesai merencanakan, siapkan orang/benda yang akan direkam.

Gunakan tripod untuk gambar yang stabil.

Rekam sekitar 10 detik, itu sudah cukup untuk cinemagraph

------------------------------------------------------------------------------

Langkah 3

Setelah Anda mendapatkan yang diinginkan, transfer file video ke komputer.

Gunakan format avi atau mov supaya bisa diimport ke sotosop.

Jika video Anda tidak menggunakan format tersebut, gunakan video converter untuk merubah formatnya.

------------------------------------------------------------------------------

Langkah 4

Untuk mengedit video di sotosop klik File > Import > Video Frames to Layers.

Window akan muncul dan dan meminta untuk memilih:

- Impor semua file ke bentuk frame, atau
- Impor bagian yang dipilih dari file video.

Semakin banyak frame artinya hasilnya akan makin halus, tapi lebih banyak memori dipakai dan ukuran file lebih besar.

Jadi, pilihan terbaik adalah di bawah 100 frame. Dalam tutorial ini, dipilih pilihan ke 2, "impor bagian yang dipilih..."

Sebelum Anda klik "OK" pastikan Anda mencentang pilihan impor yang tepat di bagian sebelah kiri window, dan centang kotak di sebelah pilihan "Make Frame Animation".

------------------------------------------------------------------------------

Langkah 5

Setelah video Anda selesai diimpor, lihat window layer Anda

Anda akan lihat setiap frame video berubah menjadi layer terpisah.

------------------------------------------------------------------------------

Langkah 6

Untuk melihat layer sebagai frame, klik windows > Animation

Di window animation, klik ikon sebelah kanan bawah gulungan film untuk melihat animasi sebagai frame.

Anda lihat bahwa tiap frame sesuai dengan tiap layer file video

Ini artinya tiap layer dan frame terhubung satu sama lain. Ingat hal ini saat Anda mengedit dan menghapus layer dan/atau frame

------------------------------------------------------------------------------

Langkah 7

Tentukan bagian yang ingin Anda buat menjadi cinemagraph dengan menekan spasi. Buang frame DAN layer yang tidak diinginkan. Ingat keduanya terhubung satu sama lain.

FYI, jika Anda menghapus frame, Frame 1 di window animasi akan selalu menjadi layer terakhir di window Layer. Jika ini membingungkan, Anda bisa mengganti nama layer supaya sama dengan nama frame
------------------------------------------------------------------------------
Langkah 8

Pilih satu layer sebagai patokan cinemagraph Anda

Duplicate layer ini dan letakkan di atas layer lain di window Layer

Namai "Alpha" karena ini akan jadi layer yang terus muncul di atas setiap layer dan frame

------------------------------------------------------------------------------

Langkah 9

Edit layer Alpha untuk menunjukkan gerakan menggunakan vector mask dan masking elemen di layer yang Anda inginkan terllihat bergerak

Jika tidak tahu apa itu vector mask atau masking, klik di sini

Di contoh ini, kita menghapus bagian mata, dan sebagian rambutnya serta rumput di belakang karena elemen itu yang ingin terlihat bergerak

------------------------------------------------------------------------------

Langkah 10

Setelah Anda hapus bagian yang diinginkan pada layer Alpha, tes cinemagraph Anda!

Di window animation Anda, pastikan animasi anda diset loop "Forever"

Dari pengujian ini, Anda bisa melihat editing apa yang perlu dilakukan

------------------------------------------------------------------------------

Langkah 11

Tantangan terbesar Anda adalah membuat gerakan loop yang halus

Hal ini bisa diatasi dengan:
- Setelah frame terakhir animasi Anda, tambahkan sebuah frame yang berisi layer Alpha dan layer paling pertama (layer paling bawah). Untuk melakukannya, duplicate frame terakhir, lalu rubah layer apa yang muncul di window layer. Kemudian, tween frame terakhir dan ini menambah frame untuk membantu memperhalus transisi loop.
- Tergantung dari gerakannya, Anda mungkin dapat membalik (reverse) frame animasi untuk membuat transisi yang lembut; pilih semua frame animasi di window frame, duplicate, dan paste setelah frame asli. Kemudian pilih semua frame duplikat dan set ke reverse dengan mengklik panah kecil turun di sebelah kanan atas window animasi (frame).

Jangan lupa untuk mengetes cinemagraph anda untuk mengetahui seberapa halus gerakannya.

------------------------------------------------------------------------------

Langkah 12

Karena cinemagraph menggunakan format GIF, warnanya tidak akan secerah format lain.

------------------------------------------------------------------------------

Langkah 13

Rubah ukuran karya Anda. Usahakan ukuran kecil untuk supaya lebih cepat dimuat.

------------------------------------------------------------------------------

Langkah 14

Anda siap menyimpan cinemagraph Anda dalam bentuk GIF.

Tapi sebelumnya, simpan file yang telah Anda edit dalam bentuk PSD sehingga Anda bisa melakukan editing lagi jika diperlukan.

Lalu pilih "save for Web & Devices"

Window akan muncul, pastikan di bagian kanan atas Anda memilih GOF dengan 256 warna sebelum Anda klik save.

------------------------------------------------------------------------------

Langkah 15

SUKSES!

------------------------------------------------------------------------------

Beberapa tips untuk mendapatkan hasil cinemagraph terbaik:
- Usahakan untuk memilih subjek yang tidak terlalu banyak bergerak.
- Pilih latar belakang yang tidak berubah (misalnya, dinding tembok atau gedung. Pohon biasanya terus begerak dan memberikan tantangan bagi mereka yang baru dalam membuat cinemagraph.
- Jangan menggunakan foto, pilihan terbaik adalah video.

sumber

Cinemagraph: Foto Diam yang menjadi Hidup

Posted In Photograph - 09.04 - 0 komentar

------------------------------------------------------------------------------

Dunia telah dibuat terpesona oleh foto sejak foto ditemukan lebih dari satu abad yagn lalu. Namun, saat video datang hal menjadi lebih baik lagi. Seiring dengan waktu, kita telah belajar untuk mencintai keduanya; gambar diam dan bergerak. Sekarang, di abad 21, sebuah tim seniman menggabungkan keduanya dengan cara yang tidak biasa.

------------------------------------------------------------------------------

Fotografer Jamie Beck dan rekannya Kevin Burg, yang memiliki latar belakang di bidang video dan gambar bergerak, mengambil foto tersebut dan merubahnya menjadi sesuatu yang berada diantara foto dan video.

------------------------------------------------------------------------------

Ciptaan mereka disebut cinemagraphs: foto diam dengan elemen kecil gerakan. Mereka mempertahankan semua ketenangan indah yang ada dalam foto tetapi menambah sedikit gerakan yang sangat mempesona.

------------------------------------------------------------------------------

Efek yang diberikan dapat berupa sedikit rasa takut saat anda tidak mengharapkan melihat gambar bergerak: mata model bergerak tiba-tiba. Namun, cinemagraph akan terlihat sangat indah setelah anda melewati tahap terkejut itu.

------------------------------------------------------------------------------

Menurut Beck dan Burg, hasil karya mereka sedikit di atas foto dan sedikit di bawah video. banyak dari gerakan di foto terlihat sangat halus dan bahkan anda tidak menyadari awalnya. gerakan yang semakin besar akan terlibat seperti video, tetapi gerakan halus tersebut yang membuat foto tersebut terihat sangat menarik.

------------------------------------------------------------------------------

Menciptakan efek gerakan ini merupakan proses yang sulit, memerlukan waktu antara beberapa jam sampai satu hati untuk menyelesaikan masing-masing foto. Foto jadi memiliki format GIF, yang banyak dari kita mengkonotasikan dengan animasi yang mengganggu di tahap awal internet mulai berkembang. Namun, jiwa seni Beck dan Burg merubah gangguan GIF menjadi seni.

------------------------------------------------------------------------------

Fotografer Jamie Beck berkomentar tentang karyanya: "Ada sesuatu yang magis foto diam - saat yang tertangkap oleh waktu - yang dapat secara terus menerus ada meski saat rana tidak menangkap gambar.

------------------------------------------------------------------------------

sumber
gambar lain

Cara Mandi Besar [Junub]

- 09.38 - 0 komentar

Mandi wajib adalah istilah yang sering digunakan oleh masyarakat kita. Nama sebenarnya adalah mandi janabah/junub. Mandi ini merupakan tatacara/ritual yang bersifat ta'abbudi dan bertujuan menghilangkan hadats besar. Bukan semata-mata mandi untuk membersihkan diri dari kuman dan kotoran yang melekat di badan. Sebab mandi janabah ini tidak mensyaratkan dipakainya sabun, shampo atau zat-zat lainnya. Cukup dengan air dan diratakan ke seluruh tubuh.

Untuk lebih jelasnya, harus juga dipahami tentang [A] rukun mandi janabah, [B] cara mandi janabat [C] sunnah dalam mandi janabah dan juga [D] hal-hal lain yang harus diperhatikan dalam mandi janabah.

A. Rukun Mandi Janabah

Untuk melakukan mandi janabah, maka ada dua hal yang harus dikerjakan karena merupakan rukun/pokok:

- Niat dan menghilangkan najis dari badan bila ada.
Sabda Nabi SAW, Semua perbuatan itu tergantung dari niatnya. (HR Bukhari dan Muslim)
- Meratakan air ke seluruh tubuh (termasuk rambut).
Sabda Nabi SAW, Setiap bagian di bawah rambut adalah janabah, maka basahkanlah rambutmu dan bersihkanlah kulit.

B. Tata Cara Mandi Janabah

Pertama kedua tangan dicuci, kemudian mandi pertama kepala, kemudian terus dari bagian sebelah kanan,kemudian kiri, terakhir cuci kaki.

Adapun urutan-urutan tata cara mandi junub, adalah sebagai berikut:

- Mencuci kedua tangan dengan tanah atau sabun lalu mencucinya sebelum dimasukan ke wajan tempat air.
- Menumpahkan air dari tangan kanan ke tangan kiri.
- Mencuci kemaluan dan dubur.
- Najis-najis dibersihkan.
- Berwudhu sebagaimana untuk sholat, dan menurut jumhur disunnahkan untuk mengakhirkan mencuci kedua kaki.
- Memasukan jari-jari tangan yang basah dengan air ke sela-sela rambut, sampai ia yakin bahwa kulit kepalanya telah menjadi basah.
- Menyiram kepala dengan 3 kali siraman.
- Membersihkan seluruh anggota badan.
- Mencuci kaki.

Dalil:

Aisyah r.a. berkata, "Ketika mandi janabah, Nabi SAW memulainya dengan mencuci kedua tangannya, kemudian ia menumpahkan air dari tangan kanannya ke tangan kiri lalu ia mencuci kemaluannya kemudia berwudku seperti wudhu` orang shalat. Kemudian beliau mengambil air lalu memasukan jari-jari tangannya ke sela-sela rambutnya, dan apabila ia yakin semua kulit kepalanya telah basah beliau menyirami kepalnya 3 kali, kemudian beliau membersihkan seluruh tubuhnya dengan air kemudian diakhir beliau mencuci kakinya." (HR Bukhari/248 dan Muslim/316)

C. Sunnah-Sunnah yang Dianjurkan dalam Mandi Janabah.

- Membaca basmalah.
- Membasuh kedua tangan sebelum memasukkan ke dalam air.
- Berwudhu' sebelum mandi. Aisyah RA berkata, "Ketika mandi janabah, Nabi SAW berwudlu seperti wudhu' orang shalat." (HR Bukhari dan Muslim)
- Menggosokkan tangan ke seluruh anggota tubuh. Hal ini untuk membersihkan seluruh anggota badan.
- Mendahulukan anggota kanan dari anggota kiri seperti dalam berwudhu'.

D. Hal-Hal yang Perlu Diperhatikan ketika Mandi Junub.

Mendahulukan anggota kanan dari anggota kiri seperti dalam berwudhu`. Hal tersebut sebagaimana ditegaskan oleh hadits dari Aisyah, ia berkata, "Rasulullah SAW menyenangi untuk mendahulukan tangan kanannya dalam segala urusannya; memakai sandal, menyisir dan bersuci." (HR Bukhori/5854 dan Muslim/268)

Tidak perlu berwudhu lagi setelah mandi. Sebagaimana dijelaskan dalam sebuah hadits dari Aisyah RA, ia berkata: Rasulullah SAW mandi kemudian sholat dua rakaat dan sholat shubuh, dan saya tidak melihat beliau berwudhu setelah mandi (HR Abu Daud, at-Tirmidzy dan Ibnu Majah).

Niat:
Bismillaahir rahmaanir raahiim
NAWAITUL GHUSLA LIROF'IL HADATSIL AKBA RI FARDLON LIL LAAHI TA'AALAA
artinya : aku niat mandi wajib utk menghilangkan hadats besar fardlu karena Allah ta'ala

sumber

Membuat Efek Melayang ShoutBox

Posted In Tips and Trick - 10.19 - 0 komentar

Sebelumnya kita telah membahas bagaimana membuat Chat Blog Sederhana menggunakan ShoutMix, kali ini akan membahas bagaimana memberikan efek melayang pada ShoutBox yang telah kita buat sebelumnya..

1. Langsung saja buka script atau edit script chat yang telah kita buat sebelumnya
[Design - Page Elements - Pilih edit pada gadget ShoutBox kita]
2. copy script di bawah ini

<style type="text/css">
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('https://lh5.googleusercontent.com/-11D5uLwFoXg/TsDE88TVysI/AAAAAAAAAh4/a8TP5XtOKgs/s128/tabs.png') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #C2C0C0;
background:#DBDADA;
padding:10px;
}
</style>
<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);
gb.opened = !gb.opened;
}
function moveGB(x0, xf){
var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gb.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
}
</script>
<div id="gb">
<div class="gbtab" onclick="showHideGB()"> </div>
<div class="gbcontent">


<iframe id="shoutmix_05c2ca" src="http://sht.mx/05c2ca" width="240" height="480" frameborder="0" scrolling="auto">
<a href="http://sht.mx/05c2ca">Join the conversation at ShoutMix</a>
</iframe>


</div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script>

Keterangan:
- untuk tulisan yang berwarna biru adalah tulisan Write Here bisa di ganti dengan gambar yang di inginkan
- untuk tulisan yang berwarna merah adalah script ShoutBox yang telah kita buat sebelumnya, ganti dengan script kalian

Chat Blog Sederhana powered by ShoutMix

Posted In Tips and Trick - 10.02 - 4 komentar

ShoutMix yang gratisan udah di hilangin -__-

ShoutMix merupakan widget yang sudah tidak asing lagi buat para Blogger.. ShoutMix adalah widget yang memungkinkan kita berkomunikasi secara langsung pada tamu yang sedang online di blog kita.. Atau lebih mudahnya seperti chat di Facebook..

berikut langkah-langkah untuk membuat chat blog sederhana menggunakan ShoutMix:
1. Kita harus register dulu di www.shoutmix.com