Opacidade Div baseada na posição da barra de rolagem

Encontre um exemplo de como diminuir umdiv quando a barra de rolagem atinge uma determinada posiçãoAqui. Mas não é um desvanecimento suave do acelerador. Aqui está o código daquele jsfiddle:

<code>var divs = $('.social, .title');
$(window).scroll(function(){
   if($(window).scrollTop()<10){
         divs.fadeIn("fast");
   } else {
         divs.fadeOut("fast");
   }
});​
</code>

Eu quero a porcentagem de opacidade para refletir a posição da barra de rolagem. Por exemplo, quando a barra de rolagem está na posição superior, a opacidade div é 100%. Quando eu rolar para baixo 35px eu quero a opacidade do div a desvanecer-se para 0%

Talvez uma técnica possa ser quando div A está a 35px do topo, div B = 100% de opacidade. Quando div A é 0px do topo, div B = 0% de opacidade. E faça-o suavemente desaparecer em todos os estágios intermediários.

Obrigado!

ATUALIZAÇÃO: Obrigado por toda a ajuda, a maioria deles trabalha razoavelmente bem, mas eu realmente preciso que funcione dentro da faixa de 35px. Então eu criei um novo exemplo que deixará muito claro como ele deve funcionar.
http://jsfiddle.net/J8XaX/1/

UPDATE 2: dispositivos móveis: eu tentei isso no meu iPhone e o fade não funciona bem. A maneira como funciona é se você deslizar até a metade e soltar o dedo, então a opacidade diminui. Mas se você tentar rolar suavemente, vai de 100% de opacidade diretamente a 0% de opacidade. Querendo saber se existe alguma maneira de corrigir isso?

Obrigado!!

questionAnswers(4)

yourAnswerToTheQuestion