Como faço para diminuir / diminuir uma div na rolagem da página?

Aqui está o jsfiddle:http: //jsfiddle.net/NKgG9

Basicamente, quero que essas caixas cor-de-rosa sejam exibidas normalmente no carregamento da página, mas assim que um usuário rolar a página, quero que desapareçam e desapareçam. Quando o usuário rola de volta para sua posição ou na parte superior da janela do navegador, desejo que essas caixas cor-de-rosa voltem a aparecer novamente. Eu sou inútil com o JS, então faça isso com alguma ajuda sobre como fazer iss

Toda a ajuda apreciada.

questionAnswers(6)

yourAnswerToTheQuestion