CKEditor 5 высота одного экземпляра - PullRequest
Новая
       17

CKEditor 5 высота одного экземпляра

1 голос
/ 01 июня 2019

У меня есть несколько экземпляров CKEditor 5, и я хочу добавить кнопку, которая изменит height texteditor. Для этого я должен изменить height одного экземпляра, возможно ли это, и если да, то как?

Примечание: Я хочу сделать кнопку максимизации, как в CKEditor 4. Есть ли плагин для этого, или я должен сделать это сам?

1 Ответ

0 голосов
/ 06 июня 2019

Развернуть функцию - Судя по тому, что я проверил, она еще не реализована. У CKEditor есть билет: https://github.com/ckeditor/ckeditor5/issues/1235

Высота редактора - Эта ссылка объясняет Как установить высоту CKEditor 5 (Classic Editor) объясняет, как это сделать навсегда. Однако, если вы хотите динамически изменять высоту редактора с помощью кнопки, вам нужно использовать небольшую хитрость, при которой вы назначаете класс CSS не непосредственно в область содержимого, а в его контейнер (обратите внимание .ck-small-editor .ck-content в классе css и document.getElementsByClassName( 'ck-editor' )[ 0 ] в JavaScript ): 

	ClassicEditor
		.create( document.querySelector( '#editor' ), {
    
		} )
		.then( editor => {
			window.editor = editor;
			
			// Assign small size to editor using CSS class in styles and button in HTML
			const editable = editor.ui.getEditableElement();
			document.getElementById( 'change-height' ).addEventListener( 'click', () => {
				document.getElementsByClassName( 'ck-editor' )[ 0 ].classList.toggle( 'ck-small-editor' );
			} );
      
		} )
		.catch( err => {
			console.error( err.stack );
		} );
.ck-small-editor .ck-content {
	min-height: 50px !important;
	height: 50px;
	overflow: scroll !important;
}
<script src="https://cdn.ckeditor.com/ckeditor5/12.0.0/classic/ckeditor.js"></script>


<div id="editor">
  <h2>The three greatest things you learn from traveling</h2>

  <p>Like all the great things on earth traveling teaches us by example. Here are some of the most precious lessons I’ve learned over the years of traveling.</p>

  <h3>Appreciation of diversity</h3>

  <p>Getting used to an entirely different culture can be challenging. While it’s also nice to learn about cultures online or from books, nothing comes close to experiencing <a href="https://en.wikipedia.org/wiki/Cultural_diversity">cultural diversity</a> in person. You learn to appreciate each and every single one of the differences while you become more culturally fluid.</p>

  <h3>Confidence</h3>

  <p>Going to a new place can be quite terrifying. While change and uncertainty makes us scared, traveling teaches us how ridiculous it is to be afraid of something before it happens. The moment you face your fear and see there was nothing to be afraid of, is the moment you discover bliss.</p>
</div>


<div>
  <button type="button" id="change-height">Change Height</button> 
</div>
...