Dalam entri kali ini EB akan kongsikan satu lagi tutorial yang menarik untuk diaplikasikan iaitu tutorial menggerakkan visitor ke mana-mana bahagian di dalam blog. EB bahagikan tutorial ni kepada 2 bahagian, iaitu gerakkan visitor ke atas ( back to top ) ,dan gerakkan visitor ke bahagian yang kita nak sama ada dalam entri atau dalam kawasan blog. Tentu ada yang tertanya, apa guna semua fungsi ni kan? Gunanya adalah memudahkan pelawat ke blog untuk mengexplore blog kita. Sebagai contoh, lepas pelawat scroll sampai bawah dan kembali baca entri pertama, tak perlulah scroll mouse banyak-banyak. Just one click, ppuufff at the top of the page. Selain itu juga, fungsi ni amat-amatlah berguna kalau kita jenis tulis entri panjang dan memerlukan pembaca pergi rujuk bahagian tertentu dalam artikel.
Fungsi ini boleh dilaksanakan dalam dua cara iaitu dengan text sahaja, atau dengan button gambar. Seperti contoh yang ada dalam blog EastbulletdotCom ini, teknik yang digunakan menggunakan button. Cuba klik “Komen Box” di tepi ni. Tak susah mana pun nak buat back to top, atau to comment box semua nih. Hanya menggunakan teknik “link”.
Tutorial Back To Top
Sekiranya anda nak “back to top” jenis text. Code nya seperti di bawah :
<a href="#">Back To Top??</a>( Cuba di sini : Back To Top?? )
Jika anda nak “back to top” jenis button. Perlu upload image ke dalam mana-mana hosting gambar, (EB galakkan upload dalam blog sendiri, boleh tengok tutorial upload gambar untuk blogspot di sini).
<a href="#"><img scr="URL KE IMAGE" width="LEBAR IMAGE" height="TINGGI IMAGE" title="To Top" alt="Back to top" /></a>Cuba di sini :
Tutorial Ke Mana Kita Hendak User Pergi
Yang ni lebih fun, dan lebih advanced. Tapi mudah jugak seperti yang sebelum ni. Teknik yang sama digunakan seperti back to top iaitu teknik “link”.
Step pertama, letakkan code di bawah ni pada bahagian yang anda nak halakan pembaca :
<a name="SEBARANG NAMA YANG SESUAI"></a>Kemudian untuk paparkan di mana pelawat nak klik pautan tu, letakkan code seperti di bawah :
<a href="#NAMA DARI SEBARANG NAMA TADI">TULISAN YANG AKAN PELAWAT NAMPAK</a>
Cuba ni : Tutorial Back To Top
Jika Nak Buat Jenis Float Button
Sebenarnya ini adalah tutorial yang menggabungkan Tutorial Float Widget With Image dan tutorial dalam entri ini. Code yang digunakan seperti di bawah :
<div style="bottom:0px ; right: 10px ; position:fixed ; z-index : 9999;"><a href="#NAMA DARI SEBARANG NAMA TADI"><img src="URL KE IMAGE" alt="" width="LEBAR IMAGEpx" height="TINGGI IMAGEpx" /></a></div>EB harap pembaca dapat faham tutorial ini sebaiknya. Sekiranya terdapat mana-mana bahagian yang tak faham atau mengalami sebarang masalah untuk ikuti Tutorial Gerakkan Visitor Ke Mana-Mana Bahagian Dalam Blog ni, sila maklumkan. Mungkin ada kesilapan penerangan EB di mana-mana kan? Teruskan membaca EastbulletdotCom untuk tutorial-tutorial mendatang!
aku buat biase2 aje, taknak beratkan blog. takut loading lame.
ke loding dia same je?
ini tak guna sebarang javascript pun, hanya html dan css biasa.. memang tak beri kesan sangat pada loading blog atau boleh kata tak beri kesan langsung pun.