Позиционирование диалога ckeditor

Диалоговые окна для CKEditor по умолчанию отображаются в середине страницы, но если страница представляет собой iframe с большой высотой, диалоги появляются вниз по странице.

Можно ли настроить CKEditor для размещения диалогов в другом квадранте страницы? Например, верхний средний?

Ответы

Ответ 1

Да, ссылка 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.

Ответ 2

Решение 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;
  }
});

Ответ 4

У меня была такая же проблема, как у 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);
    }

 }  
});

Надеюсь, этот код может помочь другим людям с той же проблемой, что и я.