Диалоговые окна для CKEditor по умолчанию отображаются в середине страницы, но если страница представляет собой iframe с большой высотой, диалоги появляются вниз по странице.
Можно ли настроить CKEditor для размещения диалогов в другом квадранте страницы? Например, верхний средний?
Да, ссылка MDaubs даст вам сделать то, что вы хотите.
Мне пришлось сделать это в прошлом, и следующий фрагмент продемонстрирует решение вашей проблемы:
CKEDITOR.on('dialogDefinition', function(e) {
var dialogName = e.data.name;
var dialogDefinition = e.data.definition;
dialogDefinition.onShow = function() {
this.move(this.getPosition().x,0); // Top center
}
})
Вы можете поместить это в конфигурационный файл или в готовую функцию для jQuery.
Решение zaf работает так, что оно помогает позиционировать диалог, но я обнаружил, что он создает кучу побочных эффектов в отношении того, как функционируют диалоговые функции (при отсутствии отображения URL-адреса изображения в диалоговом окне изображения один пример).
Оказалось, что исходный метод onShow(), который переопределяется, возвращает значимое значение, которое мы должны сохранить. Это может быть связано с плагином или чем-то, но вот код, который в конечном итоге работал у меня:
CKEDITOR.on('dialogDefinition', function(e) {
var dialogName = e.data.name;
var dialogDefinition = e.data.definition;
var onShow = dialogDefinition.onShow;
dialogDefinition.onShow = function() {
var result = onShow.call(this);
this.move(this.getPosition().x, $(e.editor.container.$).position().top);
return result;
}
});
Это может быть ваш поиск:
У меня была такая же проблема, как у Yehonatan, и я нашел этот вопрос очень быстро через Google. Но после использования ответа, предоставленного zaf, я все еще не получил диалоговое окно, чтобы отображаться в правильной позиции, когда редактор загружается внутри iframe.
Вместо метода position() я использовал метод offset(), чтобы поместить диалог прямо под панелью инструментов. Вместе с ответом jonespm я пришел к этому коде, который, кажется, работает очень хорошо, также с существующими диалогами.
CKEDITOR.on('dialogDefinition', function(e) {
var dialogName = e.data.name;
var dialogDefinition = e.data.definition;
var onShow = dialogDefinition.onShow;
dialogDefinition.onShow = function() {
this.move(this.getPosition().x, jQuery(this.getParentEditor().container.$).offset().top);
if (typeof onShow !== 'undefined' && typeof onShow.call === 'function')
{
return onShow.call(this);
}
}
});
Надеюсь, этот код может помочь другим людям с той же проблемой, что и я.