Showing posts with label Tutorial. Show all posts
Showing posts with label Tutorial. Show all posts

Tuesday, December 13, 2011

Jom tukar cursor!!

Menukar cursor untuk blog anda dapat menghilangkan rasa bosan melihat cursor default yang digunakan oleh komputer anda.(berbentuk anak panah putih). Atau mungkin juga anda inginkan sedikit kelainan pada cursor berbanding cursor biasa.

Tutorial kali ini ialah berkongsi website yang dapat memudahkan anda mendapatkan kod bagi cursor ini serta sedikit pengubahsuaian pada kod tersebut.

1. Buka website http://www.cursors-4u.com/

2. Pilih cursor kegemaran anda. (Pastikan anda TIDAK mengambil cursor yang jenis animated, kerana ianya hanya berfungsi dalam IE)

3. Copy code yang diberikan. Contoh kod adalah seperti berikut. Kemudian DELETE kod yang telahdiwarnakan seperti dibawah
<style type="text/css">body, a, a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-2/cur116.cur), progress;}</style><a href="http://www.cursors-4u.com/cursor/2008/12/17/cool-blue-outer-glow-pointer.html" target="_blank" title="Cool Blue Outer Glow Pointer"><img src="http://cursors-4u.com/support.gif" border="0" alt="Cool Blue Outer Glow Pointer" style="position:absolute; top: 0px; right: 0px;" /></a>

4. Kod akhir sepatutnya kelihatan seperti ini sahaja.

<style type="text/css">body, a, a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-2/cur116.cur), progress;}</style>

5. Kemudian dari dashboard anda > design > add a gadget > HTML/javascript, pastekan kod di atas diruangan tersebut.

6. Save dan lihat hasilnya.

Mudah bukan.:)

Read more...

Tutorial hidden shoutbox!! JOM torai!!!

UNTUK LETAK HIDDEN SHOUTBOX.

1) REGISTER DULU SHOUTBOX KALAU TAK ADA. KLIK SINI UNTUK REGISTER. DAPATKAN KOD SHOUTBOX ANDA.

2)  BUKAK DASHBOARD-->DESIGN-->PAGE ELEMENTS-->ADD GADGET


     AMBIL OPTION : HTML/JAVASCRIPT


PASTE CODE DI BAWAH DALAM RUANGAN HTML/JAVASCRIPT.


<style type="text/css">
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}

.gbtab{
height:400px;
width:150px;
float:left;
cursor:pointer;
background:url(' MASUKKAN IMAGE URL PILIHAN ANDA UNTUK IKON SHOUTBOX DI SINI ') 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(170-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">

MASUKKAN CODE SHOUTBOX ANDA DI SINI.


<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 = (140-gb.offsetWidth).toString() + "px";
</script>

3. TEKAN SAVE. 

UNTUK PILIHAN IKON SHOUTBOX, AKU DAH SEDIAKAN BEBERAPA IKON YANG...TAK TAHU LAH OK KE TAK..HAHA. GUNA LAH KALAU NAK, KALAU TAK SUKA, BUAT SENDIRI, OKEY?

::Ambil code Image URL gambar yang korang nak, paste dalam ruangan di langkah 2. yang dekat 'MASUKKAN IMAGE URL PILIHAN ANDA UNTUK IKON SHOUTBOX DI SINI;.




http://i251.photobucket.com/albums/gg309/pUnxUnwanted/Untitled-1-1.png




http://i251.photobucket.com/albums/gg309/pUnxUnwanted/sb-comel2-1.png


http://i251.photobucket.com/albums/gg309/pUnxUnwanted/sb-hk-1.png


http://i251.photobucket.com/albums/gg309/pUnxUnwanted/sb-comel1.png


http://i251.photobucket.com/albums/gg309/pUnxUnwanted/LOMO-PINK.png

Read more...