« »
September 3, 2011 | 4:11 PM

Ada sorang budak comel nie, tanya yana kat efbee(fb) macam mana nak buat top button macam yana tu. \tengss :]/. Yang mula2 dia takde keluar pun, tapi bila kita scroll ke bawah baru keluar top button tu. Okeh. Meh sini yana nak ajar macam mana nak buat macam tu. Nak buat jquery top button macam nie ada banyak step. So, hati2 bila copy paste tu. Pastikan korang buat dengan betul. Takut nanti tak jadi pulak. :)

1. Dashboard > Edit HTML > Tick Expand Widget

2. Ctrl + F, cari code nie :

3. Dah jumpa? Copy code kat bawah nie and paste before code </body> tadi.
<a href='#' id='toTop'><img src='URL IMAGE TOP BUTTON?t=1292762029' style='border:0;'/></a>

4. Cari pulak code nie :

5. Copy code kat bawah nie sebelum ]]></b:skin>
* to top */#toTop { width:100px;background:none;border:0px solid #ccc;text-align:center;padding:5px;position:fixed;bottom:10px;right:10px;cursor:pointer;color:#666;text-decoration:none; }

6. Lastly korang kena cari code :
Copy code kat bawah nie dan paste before </head>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'></script><script type='text/javascript'>/*----------------------- * jQuery Plugin: Scroll to Top * by Craig Wilson, Ph.Creative (http://www.ph-creative.com) * Bring to you by Zen from http://zenplate.blogspot.com * Copyright (c) 2009 Ph.Creative Ltd. * Description: Adds an unobtrusive "Scroll to Top" link to your page with smooth scrolling. * For usage instructions and version updates to go http://blog.ph-creative.com/post/jquery-plugin-scroll-to-top.aspx * Do not delete these infomation * Version: 1.0, 12/03/2009 -----------------------*/
$(function(){$.fn.scrollToTop=function(){$(this).hide().removeAttr("href");if($(window).scrollTop()!="0"){$(this).fadeIn("slow")}var scrollDiv=$(this);$(window).scroll(function(){if($(window).scrollTop()=="0"){$(scrollDiv).fadeOut("slow")}else{$(scrollDiv).fadeIn("slow")}});$(this).click(function(){$("html, body").animate({scrollTop:0},"slow")})}});
$(function() { $("#toTop").scrollToTop(); });

Then, korang save lah dan tengok hasilnya :)

\code warna purple tu korang boleh letak image url yg korang nak untuk top button korang :)/

Credit : >HERE< :)


Post a Comment

No harsh word here please. Thanks for the comments :)



This blog belongs to me and me only. No ripping, spamming and copying w/o my permission. Respect me and I'll respect you. Thank you :)



This template 100% made by me. Akira Himesamat. With little help from my old skins and Dinamic Drive. For header and background, I used Photoshop CS5. Color got from HTML color code. Font from Dafont and Google Web Font. Gifs picture made by me and some taken from Tumblr. Other image get from We♥It, Google and Tumblr. Kindly inform me if I'm using your materials but i don't mention here. (c) Copyright by Akira Himesama. All right reserved 2012 (c)