Find visible elements in slider div

Question

I have got a pretty standard slider component which slider UL.

I want to add active classes to only visible elements in viewport. I tried googling but all in vail. Is anyone able to shed some light on this please?

enter image description here

Following is the sliding code:

// get all lists that slider was initialised on
$lists = $(this.container).find('> ul');

// get current left position of list
currentPos = $lists.position().left;

// new left position of list is width of a page times target page number
newLeftPos = currentPos - (530 * (newPageNum-1));

score 1 · Accepted Answer · answered Jul 30 '13 at 11:35

1

if($("li").is(":visible")){
    $(this).addClass('active');
}

answered Jul 30 '13 at 11:35

Sbml

1,827
1
14
25

I don't think this will work because li's are always visible? – RuntimeException Jul 30 '13 at 11:37
Visible elements in viewport http://stackoverflow.com/questions/123999/how-to-tell-if-a-dom-element-is-visible-in-the-current-viewport – Sbml Jul 30 '13 at 11:42
Thanks, last link you provided did the job. Thanks. – RuntimeException Jul 31 '13 at 08:21

Find visible elements in slider div

1 Answers1