Как определить видимые элементы в карусели?

Question

[Егор Огурцов]

Использую популярный плагин jCarouselLite. Нужно добавить некоторые стили (установить класс etc.) к центральному блоку карусели из трех видимых. Каким образом можно его определить? Пример тут - test-domain.ru/carusel

Или, возможно, у кого нибудь на примете есть плагин с подобным функционалом, который обозначает видимые блоки?

Answer 1

[Евгений Петров]

В аргументах приходит коллекция видимых элементов — собственно то, что вам нужно.
Понятно, что вы не css будете менять — классы, классы...

$('.carousel').jCarouselLite({
	btnNext: '.next',
	btnPrev: '.prev',
	visible: 3,
	scroll: 1,
	afterEnd: function (data) {
		data.eq(1).css({
			opacity: .5
		});
	},
	beforeStart: function (data) {
		data.eq(1).css({
			opacity: 1
		});
	}
});

Comments

[Егор Огурцов]

Спасибо! Так годится!

[Егор Огурцов]

А как можно выделить центральный блок при загрузке страницы?

[Евгений Петров]

@mrdubz это очень сложно. Только связь с космосом помогает...

$('.carousel li').eq(1).css({
	opacity: .5
});

[Евгений Петров]

@mrdubz про $() тоже забыли?) Это я упреждаю вопрос.

[Егор Огурцов]

@Petroveg спасибо!

[Егор Огурцов]

@Petroveg про $() не понял. Но вижу косяк)

[Евгений Петров]

@mrdubz $() — чтобы можно было безопасно находить элементы, подключив скрипт в любом месте документа.

[Егор Огурцов]

@Petroveg сейчас при загрузке страницы отмечается центральный блок, но если немного поскролить вправо - вылезет еще один отмеченный. Как это починить? Заранее спасибо!

[Евгений Петров]

@mrdubz куда чего скроллится, если при первой же прокрутке первоначально выделенный элемент теряет выделение?

$(function () {
	$('.carousel li').eq(1).css({
		opacity: .5
	});
	$('.carousel').jCarouselLite({
		btnNext: '.next',
		btnPrev: '.prev',
		visible: 3,
		scroll: 1,
		afterEnd: function (data) {
			data.eq(1).css({
				opacity: .5
			});
		},
		beforeStart: function (data) {
			data.eq(1).css({
				opacity: 1
			});
		}
	});
});

[Егор Огурцов]

@Petroveg таки должен, но попробуйте 4 раза кликнуть на "Сюда" и приедет полупрозрачный блок.

[Егор Огурцов]

@Petroveg разобрался. Немного изменил beforeStart