2

「オーバーフロー：スクロール」を使用して、div内のdivにCKEditorを追加すると、親divをスクロールしてもツールバーが移動しません...

<div id="wrapper" style="overflow: scroll;">
    <div contenteditable="true">This is the ckedito</div>     
</div>

例は次の場所にあります: <a href="http://jsfiddle.net/W8Dt4/" rel="nofollow">http://jsfiddle.net/W8Dt4/

この問題の回避策を知っている人はいますか?

望ましい動作は次のようになると思います。

  • 十分なスペースがある場合は、エディター div の上部にツールバーを保持します。
  • 上に十分なスペースがなく、下に十分なスペースがある場合は、ツールバーをエディター div の下に移動します。
4

2 に答える 2

1

うん。CKEditor はそのようなケースを考慮したことはなく、おそらくエディタはそのようなエッジ ケースを処理することはありません。

それでも、必要なのは、これらのプラグインeditor.element.getParent()行のスクロール リスナーです。残念ながら、チケット #9816floatingspaceが解決されるまで待つ必要があります。これにより、ツールバーの再配置方法が変更され、ケースを修正できるようになるためです。修正がリリースされたら (4.2.1 で)、基本的に次のように行を変更する必要があります。

var elementParent = editor.element.getParent();

editor.on( 'focus', function( evt ) {
    ...
    elementParent.on( 'scroll', uiBuffer.input );
} );

editor.on( 'blur', function() {
    ...
    elementParent.removeListener( 'scroll', uiBuffer.input );
} );

editor.on( 'destroy', function() {
    ...
    elementParent.removeListener( 'scroll', uiBuffer.input );
} );

必要に応じて、このチケット ブランチで試してみることができます。それ以外の場合は、今後のリリースでコードにパッチを適用するまで待つ必要があります。

知っておく必要があることも 1 つあります。各フローティング ツールバーは に追加される<body>ため、エディターを囲む同じ (オーバーフローした) コンテナーに属することはありません。ツールバーはコンテナーと一緒にスクロールしますが、常にその上に浮かんでいるため、この行をハックしない限り、できることはあまりありません。私はそれをテストしていないことに注意してください。

これがお役に立てば幸いです。

于 2013-08-14T21:35:21.880 に答える