One jquery function stops another working

I have this first function that jiggers around the css of the sidebar depending on the scroll of the page, works great.

$(document).ready(function () { // document ready

if ( !! $('.sidebarholder').offset()) { // make sure element exists

var stickyTop = $('.sidebarholder').offset().top - 50; // returns number 

$(window).scroll(function () { // scroll event

var windowTop = $(window).scrollTop(); // returns number 

if (stickyTop < windowTop) {
$('.sidebarholder').css({
position: 'fixed',
top: 50
});
} else {
$('.sidebarholder').css({
position: 'absolute',
top: 650
});
}

});

}

});
 

The second function animates some divs depending on the scroll of the page, pretty self explanatory.

$(window).scroll(function () {
var scrollTop = $(window).scrollTop(),
elementOffset = $('.side-contain').offset().top,
distance = (elementOffset - scrollTop);


if(distance < 200) {

setTimeout(function () {
$('div.sc-1').animate({ width: '100%' }, '2000');
$('div.sc-2').animate({ width: '90%' }, '2000');
$('div.sc-3').animate({ width: '80%' }, '2000');
$('div.sc-4').animate({ width: '70%' }, '2000');
$('div.sc-5').animate({ width: '60%' }, '2000');
$('div.sc-6').animate({ width: '50%' }, '2000');
$('div.sc-7').animate({ width: '40%' }, '2000');
$('div.sc-8').animate({ width: '30%' }, '2000');
$('div.sc-9').animate({ width: '20%' }, '2000');
$('div.sc-10').animate({ width: '10%' }, '2000');
}, 400); 
} 


});
 

The problem is, the second one appears to stop the first one from functioning and I can't figure out why, I think it's something to do with the $(window).scroll(function () {.
Is there any reason why I can't use $(window).scroll(function () twice? It's two completely separate functions, it'd be like not being able to use .click (function (); more than once!