Combining 2 javascript into one

I have searched for answers and tried a lot of different "solutions" but nothing have worked so far (I guess the problem is that I still know way to little about javascript). I simply want to combine two different scripts into one. I have one script that load quotes, one after another, when the page is open. The other script detect when the page is scrolled a certain amount of pixels from the top (if 'yes' a text fades out and if 'no' it stays on the screen). I want my new script to load the quote-script when the page opens like normal, but if the page is scrolled down a certain amount of pixels the quote-script should stop (if scrolled back up the quote-script should come back). The first script: $(document).scroll(function() { var y = $(this).scrollTop(); if (y > 800) { $('.quote').fadeOut(); } else { $('.quote').fadeIn(); } }); The second script: $(document).ready(function() { var quotes = $(".quote"); var quoteIndex = -1; function showNextQuote() { ++quoteIndex; quotes.eq(quoteIndex % quotes.length) .fadeIn(2000) .delay(2000) .fadeOut(2000, showNextQuote); } showNextQuote(); }); My attempt to a solution (by simply combining them): $(document).scroll(function() { var y = $(this).scrollTop(); if (y > 800) { $('.quote').fadeOut(); } else { $(document).ready(function() { var quotes = $(".quote"); var quoteIndex = -1; function showNextQuote() { ++quoteIndex; quotes.eq(quoteIndex % quotes.length) .fadeIn(2000) .delay(2000) .fadeOut(2000, showNextQuote); } showNextQuote(); } });