Div Deckkraft basierend auf der Position der Bildlaufleiste

Hier finden Sie ein Beispiel zum Ausblenden von adiv wenn die Bildlaufleiste eine bestimmte Position erreichtHier. Aber es ist keine sanfte Drosselklappen-Überblendung. Hier ist der Code von diesem Jsfiddle:

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

Ich möchte, dass der Deckkraftprozentsatz die Position der Bildlaufleiste widerspiegelt. Befindet sich die Bildlaufleiste beispielsweise ganz oben, beträgt die Div-Deckkraft 100%. Wenn ich 35px nach unten scrolle, möchte ich, dass die Deckkraft des Div auf 0% verringert wird.

Vielleicht könnte eine Technik sein, wenn Div A bei 35px von oben ist, Div B = 100% Opazität. Wenn div A 0px von oben ist, ist div B = 0% Deckkraft. Und lassen Sie es in allen dazwischen liegenden Phasen gleichmäßig verblassen.

Vielen Dank!

UPDATE: Danke für all die Hilfe, die die meisten von ihnen ziemlich gut funktionieren, aber ich brauche sie wirklich, um im 35px-Bereich zu arbeiten. Deshalb habe ich ein neues Beispiel erstellt, das deutlich macht, wie es funktionieren soll.
http://jsfiddle.net/J8XaX/1/

UPDATE 2: Mobile Geräte: Ich habe dies auf meinem iPhone versucht und die Überblendung funktioniert nicht reibungslos. Die Art und Weise, wie es funktioniert, ist, wenn Sie auf halber Strecke gleiten und Ihren Finger loslassen, dann nimmt die Opazität ab. Wenn Sie jedoch versuchen, einen reibungslosen Bildlauf durchzuführen, wird die Deckkraft von 100% direkt auf 0% erhöht. Sie fragen sich, ob es eine Möglichkeit gibt, dies zu beheben?

Vielen Dank!!

Antworten auf die Frage(4)

Ihre Antwort auf die Frage