CODEWITHSUNDEEP
javascriptjquery
Simon
Simon

Reputation: 4804

How can I get the last visible Listitem of an scrollable Container by Scroll-Event?

When scroll-event fires, I want to get the last shown Listitem (also nested Listitems) from scrollable Container:

Scoll Container

On every ScrollEvent, it should be selected via jQuery:

$('#ScrollContainer').scroll(function() {

    // get last visible Listitem in ScrollContainer

});

Looking for fast and simple solution to get it.

Here is the fiddle.

Upvotes: 0

Views: 134

Answers (1)

Goodnickoff
Goodnickoff

Reputation: 2267

try this:

$('#ScrollContainer').scroll(function() {
    var liHeight = $(this).find('li').eq(0).outerHeight();
    var sctrollToBottom =  $(this)[0].scrollTop + $(this).innerHeight()-$(this).find('li').eq(0)[0].offsetTop;
    var lastItemNum = parseInt(sctrollToBottom/liHeight);
    var lastItem = $(this).find('li').eq(lastItemNum);
});

Not the most elegant approach. You may be able to optimize.

Upvotes: 2

Related Questions