Shoutbox Buka Tutup aka Keluar Masuk beserta tukar gambar
SalamMaka dengan itu aku nak kongsi. Sekarang ini dah jadi pattern dan trend Shoutbox Buka Tutup dan juga Keluar Masuk kat tepi tuh.. Nak tengok sample aku punya, sila lihat kat 'Baa ...' atas kanan tuh ..
Pertamanya, mari kita bagi kredit kepada Eriyza yang saya kira sumber kod-kod ini. Sebab aku tak pandai kod css script ini, tapi pandai cuba-cuba jaya je. Dan aku berjaya tukar macam aku buat kat atas tuh.
Maka, ini adalah sample shoutbox asal. Sila klik kat sini, untuk mengambil kod asal cik Eriyza. Sila cakap thank u kat dia juga ye. Saya tak pasti kalau Cik Eriyza ni ada buat post sambungan pasal post tersebut, kalau terSAMA dengan post ini, minta ampun Cik Eriyza
ShoutBox Eriyza |
Maka seterusnya aku mahu bagi link untuk korang guna pulak.
Haa Kalau sesiapa yang berminat untuk guna gambar macam ni, boleh amik kod kat bawah tuh ek
Orait cam na nak guna kod bawah ni;
Pastikan anda dah LOGIN
Klik ke DASHBOARD. Kemudian, klik ke DESIGN, kemudian ke PAGE ELEMENT
Klik ADD A GADGET, pilih HTML/JAVASCRIPT, kemudian Copy Paste, kod yang diberikan dibawah ini.
Dalam kod yang diberikan di bawah ini, sila Cari '<Put Your ShoutBox code in here>' dan copy paste kod shoutbox anda di situ tanpa meletakkan '<' dan '>'
<style type="text/css"> #gb{ position:fixed; top:50px; z-index:+1000; } * html #gb{position:relative;} .gbtab{ height:200px; width:200px; float:left; cursor:pointer; background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgw9ZCYLdKEYP82hd4L68gbM1jI80fawO67DCcKgFKqFWkW-vLC6cULCWJV6hTCDuQp76K4gjZW-IuMfi6I07jK9x5b-f-gWEety-dwlzOQ-xBbVwxHl7-nRp2lBBe83-gnX6iLO3CyHek/s1600/tag1.gif') no-repeat; } .gbcontent{ float:left; border:2px solid #666666; background:#F5F5F5; padding:10px; } </style> <script type="text/javascript"> function showHideGB(){ var gb = document.getElementById("gb"); var w = gb.offsetWidth; gb.opened ? moveGB(0, 150-w) : moveGB(150-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"> <Put Your ShoutBox code in here> <div style="text-align:right"> <a href="javascript:showHideGB()"> [close] </a> </div> </div> </div> <script type="text/javascript"> var gb = document.getElementById("gb"); gb.style.right = (100-gb.offsetWidth).toString() + "px"; </script> |
Ok, sila bagi feedback dan kalau ok, saya akan buat yang lain pulak. Hee ...
11 comments:
thanks atas tunjuk ajar tu ,
hari tu , warna header agak blurr , now dah okay ,
cube apai tgok ,
okay takk ?
Amboi, besopan santun sungguh
kredit yang diberi. Hehehe!!! :)
p/s : Apai, buang ler word verification tuh. Tak smart arrr! :p
mai ~ wah .. dah cantik dah .. bagus2 ..
Eriyza ~ hee .. kire ok laa kan ??
word verification tuh bukan untk elakkan kena spam ke ??
ala... dia ade gambar.. kita buat takde gambar. tak acila cam niee
er .. gambar juga ... cuma gambar dia lain la .. ak tempah yg sendiri punya ke ?
ok!!Tq..kite gn tau..
@Bulat
sama2 .. jemput2 k ..
aku ckup x ske la shoutbox cmni pai.bkn apa..
kdg2 lembab la dia nk kua.terkedek2..pastu klu tenet slow mmg lgsg x kua la.
baik pki lekat biasa tu je.
salam...
mintak izin guna ye.. :)
saia pownn gune abg unyew kod uh ok .
nice...
thankz...
Post a Comment