Trường Thực nghiệm GDPT Tây Ninh


You are not connected. Please login or register

Xem chủ đề cũ hơn Xem chủ đề mới hơn Go down  Thông điệp [Trang 1 trong tổng số 1 trang]

1Nút lên đầu trang Empty Nút lên đầu trang 2/1/2015, 7:43 am

KHCN

KHCN
Thành viên xuất sắc
Thành viên xuất sắc

Google Plus Scroll Style


Code:
::-webkit-scrollbar{height:16px;overflow:visible;width:16px}
::-webkit-scrollbar-button{height:0;width:0}
::-webkit-scrollbar-track{background-clip:padding-box;border:solid transparent;border-width:0 0 0 4px}
::-webkit-scrollbar-track:horizontal{border-width:4px 0 0}
::-webkit-scrollbar-track:hover{background-color:rgba(0,0,0,.05);box-shadow:inset 1px 0 0 rgba(0,0,0,.1)}
::-webkit-scrollbar-track:horizontal:hover{box-shadow:inset 0 1px 0 rgba(0,0,0,.1)}
::-webkit-scrollbar-track:active{background-color:rgba(0,0,0,.05);box-shadow:inset 1px 0 0 rgba(0,0,0,.14),inset -1px 0 0 rgba(0,0,0,.07)}
::-webkit-scrollbar-track:horizontal:active{box-shadow:inset 0 1px 0 rgba(0,0,0,.14),inset 0 -1px 0 rgba(0,0,0,.07)}
::-webkit-scrollbar-thumb{background-color:rgba(0,0,0,.2);background-clip:padding-box;border:solid transparent;min-height:28px;box-shadow:inset 1px 1px 0 rgba(0,0,0,.1),inset 0 -1px 0 rgba(0,0,0,.07);border-width:1px 1px 1px 6px;padding:100px 0 0}
::-webkit-scrollbar-thumb:horizontal{box-shadow:inset 1px 1px 0 rgba(0,0,0,.1),inset -1px 0 0 rgba(0,0,0,.07);border-width:6px 1px 1px;padding:0 0 0 100px}
::-webkit-scrollbar-thumb:hover{background-color:rgba(0,0,0,.4);box-shadow:inset 1px 1px 1px rgba(0,0,0,.25)}
::-webkit-scrollbar-thumb:active{background-color:rgba(0,0,0,0.5);box-shadow:inset 1px 1px 3px rgba(0,0,0,0.35)}
::-webkit-scrollbar-corner{background:transparent}
body::-webkit-scrollbar-track-piece{background-clip:padding-box;background-color:#f5f5f5;border:solid #fff;box-shadow:inset 1px 0 0 rgba(0,0,0,.14),inset -1px 0 0 rgba(0,0,0,.07);border-width:0 0 0 3px}
body::-webkit-scrollbar-track-piece:horizontal{box-shadow:inset 0 1px 0 rgba(0,0,0,.14),inset 0 -1px 0 rgba(0,0,0,.07);border-width:3px 0 0}
body::-webkit-scrollbar-thumb{border-width:1px 1px 1px 5px}
body::-webkit-scrollbar-thumb:horizontal{border-width:5px 1px 1px}
body::-webkit-scrollbar-corner{background-clip:padding-box;background-color:#f5f5f5;border:solid #fff;box-shadow:inset 1px 1px 0 rgba(0,0,0,.14);border-width:3px 0 0 3px}

Zzbaivong

2Nút lên đầu trang Empty Re: Nút lên đầu trang 2/1/2015, 7:50 am

KHCN

KHCN
Thành viên xuất sắc
Thành viên xuất sắc

Nút lên đầu trang đơn giản đẹp


Demo:

Nút lên đầu trang 3cBxTXB

Thêm vào cuối overall_footer_end:

Code:
<div id="toppage" style=""><img src="http://i.imgur.com/0LsMnPJ.png" onclick="$('html,body').animate({scrollTop: $('html').offset().top},1000);" title="Lên đầu trang"></div>

<script>
  $(window).scroll(function () {
    if ($(window).scrollTop() > 200) {
        $('#toppage').css('display', 'block')
    } else {
        $('#toppage').css('display', 'none')
    }
});
  </script>
<style>
#toppage:hover {
opacity: 1;
}
#toppage {
display: none;
position: fixed;
right: 15px;
bottom: 15px;
opacity: 0.2;
-webkit-transition: 0.3s;
-moz-transition-duration: 0.3s;
-htm-transition-duration: 0.3s;
cursor: pointer;
}
</style>
   
DEVs

3Nút lên đầu trang Empty Re: Nút lên đầu trang 2/1/2015, 7:55 am

KHCN

KHCN
Thành viên xuất sắc
Thành viên xuất sắc

Nút lên đầu forum


Nút lên đầu forum
Style: nhaccuatui (ở trang nhaccuatui nó không có fadeout)
Code: view ở đâu quên xừ nó roài =="
Mô tả: cứ mỗi lần cái thanh kéo nhích xuống dù chỉ một milimet là nó lại hiện lên, đến khi lên tới đỉnh forum là nó mất dần
Demo: http://fcatest3.forumvi.com/h15-page

Code: Cứ nhét hết vào trong overall_header là ok, còn nếu mọi người có thêm vào footer end hay gì gì mà được thì cứ chèn vào nha

Code:
<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("fast")}});$(this).click(function() {$("html, body").animate({scrollTop: 0}, "slow")})}});$(function() {$(".ontop").scrollToTop();});</script>

<div class="ontop" style="position:fixed;
background:rgba(0,0,0,0.5)!important;
right: 10px!important;
bottom: 0px!important;">

<div style="display: block;
width: 60px;
height: 26px;
background-image: url(http://stc.id.nixcdn.com/9.1/images/top.png);
background-position: center center;
background-repeat: no-repeat;">
</div>
</div>

Ở trển méo nhét cả js, css lẫn html luôn nhé

NCat

Sponsored content


Xem chủ đề cũ hơn Xem chủ đề mới hơn Về Đầu Trang  Thông điệp [Trang 1 trong tổng số 1 trang]

Permissions in this forum:
Bạn không có quyền trả lời bài viết

 
Nút lên đầu trang Flags_1