كيف أغير الشفافية لوسم Div عند scroll؟

هذا مثال بالجافاسكربت:

var divs = $('.social, .title'),
    limit = 35;  /* scrolltop value when opacity should be 0 */

$(window).on('scroll', function() {
   var st = $(this).scrollTop();

   /* avoid unnecessary call to jQuery function */
   if (st <= limit) {
      divs.css({ 'opacity' : (1 - st/limit) });
   }
});

حيث أن `.social` و `.title` هما وسمين div، وعندما يصل أعلى شريط التمرير (scrolltop) إلى 35px تقل الشفافية بقدار 1 - 35/35 = 0

وهذا مثال عملي

المصدر
تحياتي