标签:
RUNJS地址:http://runjs.cn/code/acqs9fdd
主要用了
1.position:fixed;设置标签相对当前窗口的位置。
2.scroll()方法:监听滚动条
3.scrollTop()方法:窗口中滚动条的垂直偏移
html代码:
<script id="jquery_182" type="text/javascript" class="library" src="/js/sandbox/jquery/jquery-1.8.2.min.js"></script> <script id="jqueryplugins2_jqueryform_282" type="text/javascript" class="library" src="/js/sandbox/jquery-plugins/jquery.form-2.82.js"></script> <div id="jumptop"> <a href="#">回到顶部</a> </div> <div class="test"> <div class="test1"> </div> <span>到顶部时出现</span> </div>
css代码:
a{ text-decoration:none; color:red; } #jumptop{ position:fixed; right:10px; bottom:20px; display:none; } .test{ height:1000px; } .test1{ height:110px; } span{ color:white; }
javascript代码:
$(function(){ $(window).scroll(function(){ if($(window).scrollTop()>100){ $("#jumptop").fadeIn(100); //100ms渐入 }else{ $("#jumptop").fadeOut(100); //100ms渐出 } }); });
标签:
原文地址:http://www.cnblogs.com/wukall/p/5722099.html