execute code on scrolling down an element

Question

I am using http://cubiq.org/dropbox/iscroll4/examples/simple/ in web page I'm developing and would like to exceute code as the user scrolls/drags down, for example the text within a specific row should fade in as the user scrolls down. I though I could use something like this:

$(window).on('scroll', function() {
                var st = $(this).scrollTop();
                $( 'li.frame1 img' ).css({ 
                    'top' : -(st/3)+"px",
                    'left' : -(st/3)+"px"
                }); 

            });

but the user is actually scrolling down the element #scroller and not the window. How could I adapt this or achieve what I'm trying to do?

Thanks!

Answer 1

$("#scroller").on('scroll', function() {
    var st = $(this).scrollTop();
    $( 'li.frame1 img' ).css({ 
        'top' : -(st/3)+"px",
        'left' : -(st/3)+"px"
    }); 

 });

Replacing document with "#scroller" should do the job.

Answer 2

I believe it should be the name of your scroller.

myScroller = new IScroll('#scorecardWrapper', {});
myScroller.on('scroll', function() {
            var st = $(this).scrollTop();
            $( 'li.frame1 img' ).css({ 
                'top' : -(st/3)+"px",
                'left' : -(st/3)+"px"
            }); 

        });