Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   TinyMCE растянуть на все окно 100% (https://javascript.ru/forum/misc/16892-tinymce-rastyanut-na-vse-okno-100%25.html)

aRpi 27.04.2011 11:13

TinyMCE растянуть на все окно 100%
 
Здравствуйте!
как TinyMCE Редактор растянуть на все окно чтобы при изменении размеров растягивалось? и по ширине и по высоте?

в init
width:"100%", - работает, растягивает по ширине нормально!
height:"100%", - Не работает, а НАОБОРОТ скукаёживает его высоту до "нуля", поля редактирования текста невидно.

aRpi 05.05.2011 15:16

Так вот чтобы был авторесайзинг при изменения размеров окна
Необходимо добавить обработку события:
tinyMCE.dom.Event.add(window,'resize',function(){
		var p=tinymce.DOM.getViewPort();
		tinyMCE.activeEditor.theme.resizeTo(
			p.w-12,
			p.h-173
		);
    });

revvo 07.07.2011 16:32

Цитата:

Сообщение от aRpi (Сообщение 103428)
Так вот чтобы был авторесайзинг при изменения размеров окна
Необходимо добавить обработку события:
tinyMCE.dom.Event.add(window,'resize',function(){
		var p=tinymce.DOM.getViewPort();
		tinyMCE.activeEditor.theme.resizeTo(
			p.w-12,
			p.h-173
		);
    });

Работает, спасибо. А как сделать чтобы при загрузке страницы, еще до манипулирования окном, этот код срабатывал? А то при загрузке он не растянутый по высоте появляется.

И еще вопрос, как быть если у меня два эдитора на странице? Тут, в этом коде только для активного. Как сделать для всех?

Спасибо заранее.

revvo 10.07.2011 03:12

Доброго времени суток.

Ребята, помогите разобраться. С вопросом выше разобрался. Все работает, хочу сделать теперь чтобы при загрузке код срабатывал, пока срабатывает только при ресайзе окна.

Вот этот код работает
tinyMCE.dom.Event.add(window,'resize',function(){
				//var p=tinymce.DOM.getViewPort();
				var p = document.getElementById("overview-footer");
				tinyMCE.get("editor1").theme.resizeTo(
					Math.floor(p.clientWidth/2),
					p.offsetTop - 172
				);
				tinyMCE.get("editor2").theme.resizeTo(
					Math.floor(p.clientWidth/2),
					p.offsetTop - 172
				);
				//console.log(p.clientWidth);
			});


но, когда я вытягиваю из него эти два вызова, и вставляю или в jQuery ready, или просто в конец документа, всегда получаю ошибку tinyMCE.get("editor1") is undefined. Не могу понять почему. tinyMCE.init на этот момент отработал уже, почему undefined? При этом, при ресайзе окна все по-прежнему работает как нужно.

Т.е. я хочу чтобы этот код отработал один раз при загрузке документа, а потом уже чтоб срабатывал себе по ресайзу окна (эта часть работает).

Вот весь код (это в head секции)
<script type="text/javascript">
			tinyMCE.init({
					mode : "textareas",
					theme : "advanced",
					skin : "schoolmule",
					
					theme_advanced_buttons1 : "bold,italic,underline,|,link,unlink",
					
					theme_advanced_toolbar_location : "top",
					theme_advanced_toolbar_align : "left",
					
					width : "100%"
			});
			
			tinyMCE.dom.Event.add(window,'resize',function(){
				//var p=tinymce.DOM.getViewPort();
				var p = document.getElementById("overview-footer");
				tinyMCE.get("editor1").theme.resizeTo(
					Math.floor(p.clientWidth/2),
					p.offsetTop - 172
				);
				tinyMCE.get("editor2").theme.resizeTo(
					Math.floor(p.clientWidth/2),
					p.offsetTop - 172
				);
				//console.log(p.clientWidth);
			});
			
			tinyMCE.get("editor1").theme.resizeTo(
				Math.floor(p.clientWidth/2),
				p.offsetTop - 172
			);
			tinyMCE.get("editor2").theme.resizeTo(
				Math.floor(p.clientWidth/2),
				p.offsetTop - 172
			);
	</script>


Часовой пояс GMT +3, время: 05:22.