Как указать 2 разные позиции для Colorbox на одной странице?

Question

Я создаю страницу с двумя цветными полями.

Прямо сейчас мне удалось заставить любой Colorbox в целом отображаться в фиксированной позиции, настроив файл colorbox.css:

# colorbox, #cboxOverlay {position:абсолютный;верх: 0;Слева направо: 0;Z-индекс: 9999;переполнение: скрыто;} #cboxWrapper {position: fixed;поле: 0 авто;Z-индекс: 9999;переполнение: скрытый;право: 0;top: 18px;}

Тем не менее, я бы очень хотел иметь возможность позиционировать мои два Colorbox по отдельности.Мой ход мыслей для этого состоит в том, чтобы иметь два разных CSS (например, colorbox.css и colorbox2.css) и соответственно вносить коррективы, но как мне сказать, какой Colorbox следовать какому файлу CSS?

между начальным и промежуточным уровнями, если это имеет смысл, поэтому было бы здорово, если бы кто-нибудь мог помочь мне с этим.

Спасибо!

Answer 1

лучший способ - настроить colorboxed с другими аргументами

$(".colorbox1").each(function(i) {
    $(this).colorbox({top:200});
});

$(".colorbox2").each(function(i) {
    $(this).colorbox({top:100});
});

Answer 2

вам просто нужно добавить класс для одного colorbox и переопределить правила положения для этого класса.