Zmiana opacity po scrollu

Question

Witam.

Mam take pytanko jak za pomocą jQuery zmienic opacity tła całego diva?

Chodzi o to, że mam menu fixed na samej górze i chce aby po scrollu w dół zmieniło się jego opacity na 30%.

w zasadzie to nawet nie tło tylko opacity całego diva.

KONIECZNIE MUSI BYC TO ANIMOWANE PŁYNNE PRZEJSCIE Z 100% DO 30%.

Answer 1

Piszę z telefonu więc sorka za błędy, ale pewnie chodzi o coś w stylu.

$(document).ready(function(){
   $(document).on('scroll', function(){
      var currentTop = $(window).scrollTop();
      if(currentTop >= $('#stickyNav').offset().top){
         $('#stickyNav').animate(
           {
            'opacity': '0.3'
            },
            600
          )
      }
      else{
        $('#stickyNav').animate(
           {
            'opacity': '1'
           },
           600
          ) 
      }
   })
})

Możesz też zamiast tej animacji dodać klase i animacje zrobić w samym CSS. Sorki jesli sa błędy. #stickyNav to id tego diva

Comments

Jednak moj blad z tym offset().top bo przecież ten element jest przyklejony, to lepiej zamiast tego podac po prostu jakas wartosc po ilu pikselach ma rozpocząć czyli np po 100.