preload

How To Make Smooth Chat Popup

Published in: Labels:
Di sebabkan ade yg tanya mcm mane nk wat popup tu di sini tanpa segan silu aku terangkan 1 per 1.

Pegi dekat edit layout or klik to design link.
Klik edit html n check it kotak expand widget template.
Find <head>. Shortcut kat key pad Ctrl + F.
Bila da jumpa korang pegi la mkn nasik dulu ye.. hehe..

Copy code ni n paste kat bwh td -->>
<script src="http://jqueryjs.googlecode.com/files/jquery-1.2.6.min.js" type="text/javascript"></script>  (ni utk animation handling)

Copy yg ni jgk n paste kat bwh code td -->>
<script src="http://yensdesign.com/tutorials/popupjquery/popup.js" type="text/javascript"></script> (ni utk setting bg popup)

Seterusnya find </style>.
Copy n paste code ccs ni di atas </style>. Ni codenye -->>

#popupContact {display: block;left: 436px;position: fixed !important;top: 81px !important;border: 2px solid #CECECE;display: none;font-size: 13px;height: 462px;padding: 12px;width: 408px;z-index: 2;}

 #button {margin: 100px;text-align: center;cursor:pointer;text-decoration:none;}

#backgroundPopup {background: none repeat scroll 0 0 #000000;border: 1px solid #CECECE;display: none;height: 100%;left: 0;position: fixed;top: 0;width: 100%;z-index: 1;height: 622px !important;opacity: 0.7;}

Kalau korang nk tukar kotak tu jd image just tukar #backgroundPopup tu kat -> background:bla².. tukar kpd background:url("url image"); and tambah, background-repeat: no-repeat;

Seterusnya copy ni utk button click -->>
<a id="button">Press Me</a>
Letak kat mane² yg korang rase sesuai. Klu letak dlm poket pon xpe. Bleh di bawa ke mana².
Jika korang dah ade link sendiri just buang href="something" n gantikan ngan id="button"

Pastu cari tempat yg sesuai, copy n paste code ni -->>
<div id="popupContact">


<!-- Ganti Ngan Code Chat Korang -->
<!-- Begin ShoutMix - http://www.shoutmix.com -->
<iframe title="guasyed" src="http://www.shoutmix.com/?guasyed" width="100%" height="460" frameborder="0" scrolling="auto"><a href="http://www.shoutmix.com/?guasyed">View shoutbox</a></iframe><br />
<!-- End ShoutMix -->
<!-- Sampai Kat sini jer..-->


<a href="http://guasyed.blogspot.com/2011/06/how-to-make-smooth-chat-popup.html" target="_blank" style="color:white; font-weight: bold; height: 467px;">Get This Widget</a>
</div>
<div id="backgroundPopup"></div>

Pastikan korang replace code chat aku tu ngan code korang ye.. karang glamer pulak aku nnt..

Pastu save n try. Klu jd korang mmg best, mcm suzuki best. Klu xjd.. alololo.. ciannye.. hahaha.. Hubungi aku kt fb or antar surat or dtg sdiri umh aku.
Aku akan bantu smpai jd.

Atau pon korang buka notepad. copy n save code kat bawah ni. Save as .html. Buka dr browser (mozilla/explorer/chrom/opera/netscape/safari or what so ever.. lantak korang la ye..).
<head>
<script src="http://jqueryjs.googlecode.com/files/jquery-1.2.6.min.js" type="text/javascript"></script>
<script src="http://yensdesign.com/tutorials/popupjquery/popup.js" type="text/javascript"></script>
<style>
#popupContact {display: block;left: 436px;position: fixed !important;top: 81px !important;border: 2px solid #CECECE;display: none;font-size: 13px;height: 462px;padding: 12px;width: 408px;z-index: 2;}
#button {margin: 100px;text-align: center;cursor:pointer;text-decoration:none;}
#backgroundPopup {background: none repeat scroll 0 0 #000000;border: 1px solid #CECECE;display: none;height: 100%;left: 0;position: fixed;top: 0;width: 100%;z-index: 1;height: 622px !important;opacity: 0.7;}
</style>
</head>
<center><a id="button">Press Me</a></center>
<div id="popupContact">
<!-- Ganti Ngan Code Chat Korang -->
<!-- Begin ShoutMix - http://www.shoutmix.com -->
<iframe title="guasyed" src="http://www.shoutmix.com/?guasyed" width="100%" height="460" frameborder="0" scrolling="auto"><a href="http://www.shoutmix.com/?guasyed">View shoutbox</a></iframe><br />
<!-- End ShoutMix -->
<!-- Sampai Kat sini jer..-->
<a href="http://guasyed.blogspot.com/2011/06/how-to-make-smooth-chat-popup.html" target="_blank" style="color:white; font-weight: bold; height: 467px;">Get This Widget</a>
</div>
<div id="backgroundPopup"></div>

Ni plak utk tukar btn text tu kpd image.. nampak cun sikit btn korang kan.. cun mcm pusat aku.. hehehe.. Just copy n buat mcm kat atas tu.. utk test. Kalau da puas ati, apply la kat blog korang.. Gud luck.. kebahagiaan korang kebahagiaan aku juga.. hahahahaha..(aku pun xtau knp aku gelak). Copy code ni.. -->>

<script src="http://jqueryjs.googlecode.com/files/jquery-1.2.6.min.js" type="text/javascript"></script>
<script src="http://yensdesign.com/tutorials/popupjquery/popup.js" type="text/javascript"></script>
<style>
#popupContact {display: block;left: 436px;position: fixed !important;top: 81px !important;border: 2px solid #CECECE;display: none;font-size: 13px;height: 462px;padding: 12px;width: 408px;z-index: 2;}
#button, #test {margin: 100px;text-align: center;cursor:pointer;text-decoration:none;}
#backgroundPopup {background: none repeat scroll 0 0 #000000;border: 1px solid #CECECE;display: none;height: 100%;left: 0;position: fixed;top: 0;width: 100%;z-index: 1;height: 622px !important;opacity: 0.7;}
</style>
</head>
<center><!--<a id="button">Press Me</a>-->
<a id="button"><img src="http://www.psdgraphics.com/wp-content/uploads/2009/07/push-button.jpg"  width="50px" height="50px"/></a></center>
<div id="popupContact">


<!-- Ganti Ngan Code Chat Korang -->
<!-- Begin ShoutMix - http://www.shoutmix.com -->
<iframe title="guasyed" src="http://www.shoutmix.com/?guasyed" width="100%" height="460" frameborder="0" scrolling="auto"><a href="http://www.shoutmix.com/?guasyed">View shoutbox</a></iframe><br />
<!-- End ShoutMix -->
<!-- Sampai Kat sini jer..-->


<a href="http://guasyed.blogspot.com/2011/06/how-to-make-smooth-chat-popup.html" target="_blank" style="color:white; font-weight: bold; height: 467px;">Get This Widget</a>
</div>
<div id="backgroundPopup"></div>

Good Luck..!!

p/s: Ilmu adalah milik Allah. Ia bkn utk disimpan tp utk disebarkan.

About Me

Aku yang masih berkelana.. Di dalam penjara dunia.. Mencari jalan ke syurga.. Terjerat di jaring neraka.. Tersembam di lembah noda.. Kini bangkit mencuci dosa.. Rahmat Allah tiada penghujungnya..

بِسْمِ اللهِ الرَّحْمنِ الرَّحِيمِ



Suasana yg paling indah ialah di kala mlm mnjelma.. di saat manusia sedang lena.. di ketika hati merindui Penciptanya...