简体   繁体   English

使 <div> 滚动显示

[英]Make <div> appear upon scrolling

I am new to Javascript, so I apologize if this is a mess. 我是Java语言的新手,所以很抱歉。 After reading this post , I implemented the code necessary to make a div appear after the user starts to scroll. 阅读这篇文章后 ,我实现了在用户开始滚动后使div出现所需的代码。 When I put the code into JSFiddle ( http://jsfiddle.net/EnzoMac/ZyKar/1212/ ) it works perfectly. 当我将代码放入JSFiddle( http://jsfiddle.net/EnzoMac/ZyKar/1212/ )时,它可以正常工作。 However, it does not work at all on my website. 但是,它根本无法在我的网站上运行。 It is in the JSFiddle, but here is my code: 它在JSFiddle中,但这是我的代码:

HTML/ JavaScript: HTML / JavaScript:

<div class="backtotop"> <a href="#">Back to Top</a></div>

    <script type="text/javascript">
    $(document).scroll(function () {
    var y = $(this).scrollTop();
    if (y > 1) {
        $('.backtotop').fadeIn();
    } else {
        $('.backtotop').fadeOut();
    }

});
</script>

CSS: CSS:

.backtotop
    {
        display: none;
        width:200px;
        height:inherit;
        position:fixed;
        bottom:0;
        right:0;
        border:thin solid black;
        background:lightgray;
        color:black;
        z-index:1;
        text-align:center;
    }

.backtotop a {
    color:black;
    font-family:calibri;
}

Basically, my question is this: Why doesn't my code work? 基本上,我的问题是:为什么我的代码不起作用?

Thank you very much! 非常感谢你!

Are you using jQuery install link anywhere before this code? 您是否在此代码之前的任何地方使用jQuery安装链接? And if yes, then check your javascript console and see what errors are there. 如果是,请检查您的JavaScript控制台,看看有什么错误。
jQuery Install Link: jQuery安装链接:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM