2012-07-13 19 views
5

Dodałem skrypt, który znalazłem tutaj. To działa przyjemność. Jednak utknąłem, próbując zastosować efekt zanikania. Z chwilą, gdy po prostu się wyłącza.Zniknij efekt przewijania

script type="text/javascript"> 


    $(document).ready(function() { 


     $(window).scroll(function() { 
       var height = $('body').height(); 
       var scrollTop = $('body').scrollTop(); 
       var opacity = 1; 


       if(scrollTop > 400) { 
        opacity = 0; 
       } 

      $('.social').css('opacity', opacity); 
     }); 
    }); 
</script> 

EDYCJA: Wiązałem to i działa. Dzięki tak dużo facetów:

<script type="text/javascript"> 
$(window).scroll(function() { 
// The social div 
var $socialDiv = $('.social'); 

//Get scroll position of window 
var windowScroll = $(this).scrollTop(); 

//Slow scroll of social div and fade it out 
$socialDiv.css({ 
'margin-top' : - (windowScroll/3) + "px", 
'opacity' : 1 - (windowScroll/550) 
}); 
}); 
</script>​ 

Odpowiedz

2

Należy użyć .animate() lub .fadeTo() dla tego efektu.

Za pomocą .css('opacity', opacity); sprawisz, że Twój element nagle zniknie.

+0

Przepraszam, jestem trochę głupi, zmieniam go na $ (". Social") .animate ("slow"); – Michael

+1

Łatwiej jest użyć '.fadeTo()' tutaj. Możesz użyć czegoś takiego jak '$ ('. Social'). FadeTo ('slow', nieprzezroczystość);' Również zamiast 'slow' możesz użyć liczby milisekund, którą musi zanikać. Na przykład '$ (". Social "). FadeTo (500, nieprzezroczystość);' – RRikesh

Powiązane problemy