PDA

View Full Version : Code Up To Top rất hay cho vBB


ShineGhost
13-02-14, 10:52 PM
Hướng dẫn:
Chèn code css sau vào additional.css

/* <!--- CSS button trở lên --->*/

#ltr-gotop{cursor:pointer;width:30px;height:30px;positi on:fixed !important;position:absolute;z-index:999;text-indent:-9999px;border:1px solid #144F69;background-color:#067BAF;background-image:-webkit-radial-gradient(ellipse at center top,#2493C4,#086A95);background-image:-moz-radial-gradient(ellipse at center top,#2493C4,#086A95);background-image:-ms-radial-gradient(ellipse at center top,#2493C4,#086A95);background-image:-o-radial-gradient(ellipse at center top,#2493C4,#086A95);background-image:radial-gradient(ellipse at center top,#2493C4,#086A95);-webkit-box-shadow:inset 0 0 0 1px #2493C4,0 1px 3px black;-moz-box-shadow:inset 0 0 0 1px #2493C4,0 1px 3px black;box-shadow:inset 0 0 0 1px #2493C4,0 1px 3px black;-webkit-border-radius:10px 0 0 0;-moz-border-radius:10px 0 0 0;border-radius:10px 0 0 0;overflow:hidden}
#ltr-gotop:hover:after{border-bottom-color:white}
#ltr-gotop:after{content:"";display:block;width:0;height:0;border-width:10px 4px;border-style:solid;border-color:transparent transparent #C3D1D7 transparent;position:absolute;top:0;left:11px}


#ltr-gobottom{cursor:pointer;width:30px;height:30px;pos ition:fixed!important;position:absolute;top:26px;r ight:0;z-index:99;text-indent:-9999px;border:1px solid #144F69;background-color:#067BAF;background-image:-webkit-radial-gradient(ellipse at center top,#2493C4,#086A95);background-image:-moz-radial-gradient(ellipse at center top,#2493C4,#086A95);background-image:-ms-radial-gradient(ellipse at center top,#2493C4,#086A95);background-image:-o-radial-gradient(ellipse at center top,#2493C4,#086A95);background-image:radial-gradient(ellipse at center top,#2493C4,#086A95);-webkit-box-shadow:inset 0 0 0 1px #2493C4,0 1px 3px black;-moz-box-shadow:inset 0 0 0 1px #2493C4,0 1px 3px black;box-shadow:inset 0 0 0 1px #2493C4,0 1px 3px black;-webkit-border-radius:0 0 0 10px;-moz-border-radius:0 0 0 10px;border-radius:0 0 0 10px;overflow:hidden}
#ltr-gobottom:hover:after{border-top-color:white}
#ltr-gobottom:after{content:"";display:block;width:0;height:0;border-width:10px 4px;border-style:solid;border-color:#C3D1D7 transparent transparent transparent;position:absolute;top:10px;left:11px}


/* <!--- kết thúc CSS button trở lên ---> */



Tiếp theo copy code bên dưới chèn vào footer:


<script type="text/javascript">//<=!=[=C=D=A=T=A=[
document.write(unescape("%3Cscript%20type%3D%27text/javascript%27%3E//%3C%21%5BCDATA%5B%0A//%20%3C%21---%20Ch%u1EC9nh%20s%u1EEDa%20b%u1EDFi%20LTr%20---%3E%0A%24%28window%29.scroll%28function%20%28%29%2 0%7B%0A%20%20%20%20if%20%28%24%28this%29.scrollTop %28%29%20%3E%20100%29%20%7B%0A%20%20%20%20%20%20%2 0%20%24%28%22%23ltr-gotop%22%29.removeAttr%28%22href%22%29%3B%0A%20%20 %20%20%20%20%20%20%24%28%22%23ltr-gotop%22%29.stop%28%29.animate%28%7B%0A%20%20%20%2 0%20%20%20%20%20%20%20%20bottom%3A%20%220%22%2C%0A %20%20%20%20%20%20%20%20%20%20%20%20right%3A%20%22 0%22%0A%20%20%20%20%20%20%20%20%7D%2C%20%7B%0A%20% 20%20%20%20%20%20%20%20%20%20%20duration%3A%20800% 2C%0A%20%20%20%20%20%20%20%20%20%20%20%20queue%3A% 20false%0A%20%20%20%20%20%20%20%20%7D%29%0A%20%20% 20%20%7D%20else%20%7B%0A%20%20%20%20%20%20%20%20%2 4%28%22%23ltr-gotop%22%29.stop%28%29.animate%28%7B%0A%20%20%20%2 0%20%20%20%20%20%20%20%20bottom%3A%20%22-50%22%2C%0A%20%20%20%20%20%20%20%20%20%20%20%20rig ht%3A%20%22-50%22%0A%20%20%20%20%20%20%20%20%7D%2C%20%7B%0A%20 %20%20%20%20%20%20%20%20%20%20%20duration%3A%20100 0%2C%0A%20%20%20%20%20%20%20%20%20%20%20%20queue%3 A%20false%0A%20%20%20%20%20%20%20%20%7D%29%0A%20%2 0%20%20%7D%0A%20%20%20if%20%28%24%28this%29.scroll Top%28%29%20%3E%20100%29%20%7B%0A%20%20%20%20%20%2 0%20%20%24%28%22%23ltr-gobottom%22%29.removeAttr%28%22href%22%29%3B%0A%20 %20%20%20%20%20%20%20%24%28%22%23ltr-gobottom%22%29.stop%28%29.animate%28%7B%0A%20%20%2 0%20%20%20%20%20%20%20%20%20top%3A%20%22-50%22%2C%0A%20%20%20%20%20%20%20%20%20%20%20%20rig ht%3A%20%22-50%22%0A%20%20%20%20%20%20%20%20%7D%2C%20%7B%0A%20 %20%20%20%20%20%20%20%20%20%20%20duration%3A%20800 %2C%0A%20%20%20%20%20%20%20%20%20%20%20%20queue%3A %20false%0A%20%20%20%20%20%20%20%20%7D%29%0A%20%20 %20%20%7D%20else%20%7B%0A%20%20%20%20%20%20%20%20% 24%28%22%23ltr-gobottom%22%29.stop%28%29.animate%28%7B%0A%20%20%2 0%20%20%20%20%20%20%20%20%20top%3A%20%220%22%2C%0A %20%20%20%20%20%20%20%20%20%20%20%20right%3A%20%22 0%22%0A%20%20%20%20%20%20%20%20%7D%2C%20%7B%0A%20% 20%20%20%20%20%20%20%20%20%20%20duration%3A%201000 %2C%0A%20%20%20%20%20%20%20%20%20%20%20%20queue%3A %20false%0A%20%20%20%20%20%20%20%20%7D%29%0A%20%20 %20%20%7D%0A%0A%7D%29%3B%0A%24%28function%20%28%29 %20%7B%0A%20%20%20%20%24%28%22%23ltr-gotop%22%29.click%28function%20%28%29%20%7B%0A%20% 20%20%20%20%20%20%20%24%28%22html%2C%20body%22%29. animate%28%7B%0A%20%20%20%20%20%20%20%20%20%20%20% 20scrollTop%3A%200%0A%20%20%20%20%20%20%20%20%7D%2 C%20%22slow%22%29%3B%0A%20%20%20%20%20%20%20%20ret urn%20false%0A%20%20%20%20%7D%29%0A%20%20%20%20%24 %28%22%23ltr-gobottom%22%29.click%28function%20%28%29%20%7B%0A% 20%20%20%20%20%20%20%20%24%28%22html%2C%20body%22% 29.animate%28%7B%0A%20%20%20%20%20%20%20%20%20%20% 20%20scrollTop%3A%20%24%28%27%23footer%27%29.offse t%28%29.top%0A%20%20%20%20%20%20%20%20%7D%2C%20970 %29%3B%0A%20%20%20%20%20%20%20%20return%20false%0A %20%20%20%20%7D%29%0A%7D%29%3B//%5D%5D%3E%0A//%20%3C%21---%20Ch%u1EC9nh%20s%u1EEDa%20b%u1EDFi%20LTr%20---%3E%0A%3C/script%3E")); // Code1k.com
//]=]=>
</script><script type="text/javascript">//<=!=[=C=D=A=T=A=[
// <!--- Chỉnh sửa bởi LTr --->
$(window).scroll(function () {
if ($(this).scrollTop() > 100) {
$("#ltr-gotop").removeAttr("href");
$("#ltr-gotop").stop().animate({
bottom: "0",
right: "0"
}, {
duration: 800,
queue: false
})
} else {
$("#ltr-gotop").stop().animate({
bottom: "-50",
right: "-50"
}, {
duration: 1000,
queue: false
})
}
if ($(this).scrollTop() > 100) {
$("#ltr-gobottom").removeAttr("href");
$("#ltr-gobottom").stop().animate({
top: "-50",
right: "-50"
}, {
duration: 800,
queue: false
})
} else {
$("#ltr-gobottom").stop().animate({
top: "0",
right: "0"
}, {
duration: 1000,
queue: false
})
}


});
$(function () {
$("#ltr-gotop").click(function () {
$("html, body").animate({
scrollTop: 0
}, "slow");
return false
})
$("#ltr-gobottom").click(function () {
$("html, body").animate({
scrollTop: $('#footer').offset().top
}, 970);
return false
})
});//]=]=>
// <!--- Chỉnh sửa bởi LTr --->
</script>
<a id="ltr-gotop" style="bottom: -50px; right: -50px;">Lên Trên!</a>


<!--- Kết thúc Javascript button trở lên <LTr> --->


Vậy là xong nhé , chúc bạn thành công