Tuesday 19 February 2013

Cara Nak Buat Button Back To Top


arini xtau nk share ape2...rse cm nk share byk bnde..tapi xtau bnde ape yg nk share...huhu...ni tutorial sy jumpa kt satu blog...credit to blogger...sbb sy copy paste tutor die...huhu...wat sendiri cm mls plk...


STEP 1:

Pergi ke Dashboard > Design > Edit HTML > Klik Expand Widget Templates,

STEP 2:

Tekan ctrl+F pada keyboard anda dan paste kod dibawah ke dalam kotak find.

</body>

STEP 3:

Copy code DI BAWAH dan paste DI ATAS kod </body> .

<style type="text/css">
#amazi {-moz-border-radius: 5px;-webkit-border-radius: 5px;border-radius: 5px; width:100px;background-color: #cococo;background-color: rgba(238, 238, 238, 0.6);filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#99EEEEEE',EndColorStr='#99EEEEEE');text-align:center;padding:5px;position:fixed;bottom:10px;right:700px;cursor:pointer;color:#444;text-decoration:none;border:1px solid #C9C9C9;}
</style>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script type='text/javascript'>
$(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() {
$("#amazi").scrollToTop();
});
</script>
<a href='#' id='amazi' style='display:none;'>Back to Top </a>

STEP 4:

Save and done

No comments:

Post a Comment

LinkWithin

Related Posts Plugin for WordPress, Blogger...