<span style="font-size:14px"><p id="back-to-top"><a href="#top"><span></span>返回顶部</a></p></span>
# Back-to-Top { position: Fixed; the display: none; bottom: 100px; right: 80px; } # Back-to-Top A { text-align = left: Center; text-Decoration: none; Color: # d1d1d1; the display : Block; width: 64PX; / * used in CSS3 transition property to add the text hoplinks gradients * / -moz-transition: Color lS; -webkit-transition: Color lS; -o-transition: Color lS ; } # A Back-to-Top: hover { Color: # 979 797; } # A Back-to-Top span { background: transparent URL (/static/imgs/sprite.png?1202) NO-REPEAT -25px -290px ; border-the RADIUS: 6px; Run the display: Block; height: 64PX; width: 56px; margin-bottom: 5px; / * used in CSS3 transition property to the < span > Add gradients * / label background color -moz-transition: background lS; -webkit-transition: background lS; -o-transition : background lS; } # A Back-to-Top: hover span { background: transparent URL (/static/imgs/sprite.png?1202) NO-REPEAT -25px -290px; }
< Script the src = "http://ajax.microsoft.com/ajax/jQuery/jquery-1.7.2.min.js" > </ Script > < Script > $ ( function () { // when the position of the slider is at 100 pixels from the top of the jump link appears, disappears or $ ( function () { $ (window) .scroll ( function () { IF ($ (window) .scrollTop () > 100 ) { $ ( " # Top-to-Back " ) .fadeIn ( 1500 ); } the else { $ (" # The Back-to-Top " ) .fadeOut ( 1500 ); } }); // When you click a link to jump back to the top of the page position $ ( " # the Back-to-Top " ) .click ( function () { // $ ( 'body, HTML') Animate ({scrollTop: 0}, 1000);. IF ($ ( ' HTML ' ) .scrollTop ()) { $ ( ' HTML ' ) .animate ({scrollTop: 0 }, 1000 ); return to false ; } $ ( 'body').animate({ scrollTop: 0 }, 1000); return false; }); }); }); </script>