Question

我不能让我的“go to top”id=arrow-up div在例如页面顶部。

在页面顶部，我得到了

所以当我不在页面顶部时，我希望arrow-up div到visible(show("slow"))。

 var tmp = $(window).height();

Tmp用于获取视口高度...不确定是否正确？

我见过其他解决方案，但它们只是一样......而且我不能让它们工作，而且它们使用:in-viewport字体。我可以使用视口制作它还是我可以跟踪它？

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js">        </script>
<script src="bootstrap-3.1.1-dist/js/bootstrap.min.js"></script>
<script src="http://malsup.github.com/jquery.form.js"></script>
<script src="/jquery/isInViewport.min.js"></script>



$(window).scroll(function() {
  if($('#pageStart:in-viewport(tmp)')){
    $("#arrow-up").hide("slow");
  }else{
    $("#arrow-up").show("slow");
  }
});

Answer 1

“所以我希望箭头向上的div显示（显示（”慢“））不开启时页面顶部“

我是这样做的：

http://jsfiddle.net/wf_4/GubeC/

SCRIPT：

// fade in #back-top
$(function () {
    $(window).scroll(function () {
        if ($(this).scrollTop() > 300) {
            $('.back-top').fadeIn();
        } else {
            $('.back-top').fadeOut();
        }
    });

    // scroll body to 0px on click
    $('.back-top').click(function () {
        $('body,html').animate({
            scrollTop: 0
        }, 1600);
        return false;
    });
});

CSS

.back-top {
    width:25px;
    height:25px;
    background:#ff0000;
    position:fixed;
    bottom:68px;
    right:5px;
    display:none;
    opacity:0.8;
}

HTML

<div class="back-top" title="Top of Page"></div>

当滚动到＆＃34;返回顶部时，获取div显示/隐藏＆＃34;链接

1 个答案: