Fade out Caption on Scroll

kreativos_themes's Avatar

kreativos_themes

09 Oct, 2012 09:20 AM

Hello Dmitry,

now i have a Slider related issue :)

I try to fade out the rsBlock of the Slider by scrolling the page. Here is the Link: http://xancoremedia.com/royal/
I´ve put this Code inside the royalSlider but it doesent work. You can see it in the Source Code. Can you help me?

var divs = $('.rsABlock'); $(window).scroll(function(){ var percent = $(document).scrollTop() / ($(document).height() - $(window).height()); divs.css('opacity', 1 - percent); });

  1. Support Staff 1 Posted by Dmitry Semenov on 10 Oct, 2012 06:26 AM

    Dmitry Semenov's Avatar

    Hi,

    Slide HTML may not be added to DOM immeditely after initializaation, so you should bind all events before initialization, or just check if block exists. e.g.:

    var divs; 
    $(window).scroll(function(){ 
        if(!divs || !divs.length) {
           divs  = $('.rsABlock')
        }
        var percent = $(document).scrollTop() / ($(document).height() - $(window).height());
        divs.css('opacity', 1 - percent); 
    });
    

    Dmitry

  2. 2 Posted by kreativos_theme... on 10 Oct, 2012 06:42 AM

    kreativos_themes's Avatar

    Works perfectly! Thanks Dmitry.

  3. kreativos_themes closed this discussion on 10 Oct, 2012 06:42 AM.

Comments are currently closed for this discussion. You can start a new one.

Keyboard shortcuts

Generic

? Show this help
ESC Blurs the current field

Comment Form

r Focus the comment reply box
^ + ↩ Submit the comment

You can use Command ⌘ instead of Control ^ on Mac