jQuery colorbox: как я могу изменить положение colorbox

Question

По умолчанию colorbox отображается как по вертикали, так и по горизонтали на экране. Есть ли способ изменить это, например, до 10% от вершины по вертикали и по центру по горизонтали?

Answer 1

Это аннулирует верхнее положение, и вы можете сделать то же самое с левой и т.д.:

#colorbox { top: 100px !important; } 

10% от верхней части будет сложнее, вам придется реализовать собственную логику позиционирования в OnLoad обратного вызова каждый раз, когда отображается colorbox, или расширяйте код colorbox, но не можете быстро это сделать.

UPDATE

Colorbox теперь имеет встроенную опцию, чтобы сделать это:

$("a").colorbox({ top: 100, left: "50%" }) 

UPDATE 2

Если вы не привязаны к ColorBox, я настоятельно рекомендую используя qTip2.
Более удобная обработка позиций (стиль пользовательского интерфейса jQuery), более чистый вывод HTML и упрощенная поддержка IE < 8.

Answer 2

#cboxWrapper{ 
    position:fixed; 
    top:100px; 
    left:300px; 
    z-index:9999; 
    overflow:hidden; 
} 

Применить этот стиль в JSP или других веб-страницах.

Answer 3

Вы можете использовать настройку colorbox при инициализации colorbox. Например, чтобы иметь #colorbox на той же высоте, где вы щелкнули, использовать это (.colorbox это определяемый пользователем класс Colorbox):

$(".colorbox").each(function(i) { 
    var offset = $(this).offset(); 
    $(this).colorbox({top:offset.top}); 
}); 

Вы можете также, например, установить минимальную вершину и сделать #colorbox чуть выше

$(".colorbox").each(function(i) { 
    var offset = $(this).offset(); 
    var o = offset.top-200; 
    if(o<100){o=100;} 
    $(this).colorbox({top:o}); 
}); 

Answer 4

мне пришлось переопределить положение ColorBox на лету и нашел следующее решение:

в jquery.colorbox.js, функция publicMethod.position использовать кэшированную версию настроек. Чтобы изменить параметры .left/top на лету, нам нужно использовать свойство настроек объекта. Для достижения этой цели, мы должны заменить settings.top/left на this.settings.top/left внутри функции (пер 499):

if(typeof this.settings!="undefined"){ 
    settings.left=this.settings.left; 
    settings.top=this.settings.top; 
} 
if (settings.right !== false) {... 

Теперь мы можем изменить положение объекта:

$.colorbox.settings.left=newLeft; 
$.colorbox.settings.top=newTop; 
$.colorbox.position();