Blogger problem: Inserting jQuery scrollTop in Blogger HTML not working

JavaScript
1

I am having problems making jQuery scripts work on my Blogger blog. [ It works on other platforms such as in Tumblr and also works on jsFiddle and Codepen ]. But, for some reason, I can’t get it to work on Blogger Blogspot blog.

Here’s the code:


<style>
#scrollfooter {
    position:fixed;
    left:0px;
    bottom:0px;
    height:100px;
    width:100%;
    display:none;
}
</style>
<div id="scrollfooter">Contents here will not be visible on top of the page, but will appear when scrolled down 200px.</div>
<script type='text/javascript'>
$(window).scroll(function() {
    if ($(this).scrollTop() < 200) {
        $("#scrollfooter").hide();
    }
    else {
        $("#scrollfooter").show();
    }
});
</script>

I tried using this for the javascript:


<script type='text/javascript'>
    //<![CDATA[
$(window).scroll(function() {
    if ($(this).scrollTop() < 200) {
        $("#scrollfooter").hide();
    }
    else {
        $("#scrollfooter").show();
    }
});
</script>

… but to no avail. I have tried putting the code in Blogger gadget, which gained me nothing.

Your big help would be so much appreciated. Thanks SitePoint, members and staff! :slight_smile:

2

Gotta ask the obvious: Have you loaded jQuery, and does it come before the script you’re running?