jquery实现置顶和置底特效

最新推荐文章于 2020-09-22 22:08:40 发布

dengchi5635

最新推荐文章于 2020-09-22 22:08:40 发布

阅读量136

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/Iven-zhang/p/3314788.html

版权

今天用用Jquery实现置顶和置底特效是一款非常实用的效果，当你网站的内容多的时候，它就可以用上场了，有了它之后你就不用滚动你的鼠标就可以实让页面的滚动条滚动到顶部和底部，用法很简单，不说了

 1 $(function(){  
 2     $("#updown").css("top",window.screen.availHeight/2-100+"px");  
 3     $(window).scroll(function() {         
 4         if($(window).scrollTop() >= 100){  
 5             $('#updown').fadeIn(300);   
 6         }else{      
 7             $('#updown').fadeOut(300);      
 8         }    
 9     });  
10     $('#updown .up').click(function(){$('html,body').animate({scrollTop: '0px'}, 800);});  
11     $('#updown .down').click(function(){$('html,body').animate({scrollTop: document.body.clientHeight+'px'}, 800);});  
12 });