# Jesse Lawson

## Software engineering, artificial intelligence, writing, and open-source tools

Jan 1, 0001 - Code Snippets

# JQuery scrollTop not working with Zurb Foundation

Recently I discovered something about the way Foundation calls JQuery. I was trying to get a function to reveal a div on window scroll and discovered that you only have to change the syntax for the function call to get it to work.

## Error: undefined function

How can document be an undefined function? Oh, because we’re calling our code wrong. Here is what I was trying to do:

<script>
(function($) {$(document).foundation();
})(jQuery);
</script>

<script type="text/javascript">

$(document).scroll(function (evt) { var y =$(this).scrollTop();
if (y > 100) {
$('#title-plaintext').fadeIn(500); } else {$('#title-plaintext').fadeOut(500);
}

});

</script>


… and here’s how I fixed it:

<script>
(function($) {$(document).foundation();
})(jQuery);
</script>

<script type="text/javascript">
(function($) {$(document).scroll(function (evt) {
var y = $(this).scrollTop(); if (y > 100) {$('#title-plaintext').fadeIn(500);
} else {