Редактор TinyMCE фиксированного размера без скроллеров? - PullRequest
Новая
       14

Редактор TinyMCE фиксированного размера без скроллеров?

4 голосов
/ 30 сентября 2011

На данный момент у меня есть это: 

    tinyMCE.init({
// General options
mode : "exact",
elements : "fkField, lkField, ukcField, khField",
theme : "advanced",
plugins : "table",
width : "300",
height: "185",
// Theme options
theme_advanced_buttons1 : "fontsizeselect, bold,italic,underline,bullist, cleanup, |,justifyleft,justifycenter,justifyright",
theme_advanced_buttons2 : "tablecontrols", 
theme_advanced_buttons3 : "", 
theme_advanced_buttons4 : "", 

theme_advanced_toolbar_location : "bottom",
theme_advanced_toolbar_align : "center",
theme_advanced_resizing : false
    });

Это дает мне редактор с размером 300x185.

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

Таким образом, вы не можете ввести больше текста, и скроллер не должен появляться (отключить прокрутку)

Прямо сейчас вы можете внизу внутри редактора просто сделать новыйлинии, и он добавит скроллер <- что я не хочу, чтобы это произошло </p>

Как я могу это сделать?Это невозможно?Я проводил исследования в течение некоторого времени, но, возможно, это просто я искал неправильно ..

Спасибо

Ответы [ 5 ]

1 голос
/ 11 июня 2013

добавить в файл ccs следующий код 

.mceContentBody{
         overflow-y:hidden!important;
      }

и добавьте путь к css-файлу в атрибуте content_css из tinymce 

content_css : /path/to/css/file.ss
0 голосов
/ 20 февраля 2019

Гораздо проще и проще было бы решение: 

tinymce.init({
    selector: '#container',
    },
    init_instance_callback: function (ed) {
        tinymce.activeEditor.getBody().style.overflow = 'hidden'
    },
});

Пояснение: В Init callback получите тело для TinyMCE и при необходимости измените стиль.

В этом случае удалить полосу прокрутки overflow = 'hidden'.

0 голосов
/ 23 июля 2016

для меня это работало, просто добавляя правила в обычную таблицу стилей, не было необходимости добавлять файл css в атрибут content_css (пример в scss) 

.my-tinymce-container {
  width: 200px;
  .mce-edit-area {
    height: 200px;
    overflow-y: hidden;
  }
}
0 голосов
/ 08 сентября 2012

Я заставил его работать, добавив его в мой дополнительный CSS-файл tinyMCE: 

IFRAME {overflow:hidden;}

Раньше полосы прокрутки были отключены только в Firefox.Это исправляет это и для Chrome.Тем не менее, он добавляет серую полосу сбоку полосы прокрутки внизу, поэтому мне нужно увеличить высоту моего текстового редактора.

0 голосов
/ 30 сентября 2011

Вам нужно будет написать собственный плагин. Проверяйте высоту редактора при каждом нажатии клавиши (вы можете использовать встроенное событие tinymce onKeyUp). Если высота изменяется, удалите последний вставленный код.

РЕДАКТИРОВАТЬ: Как получить текущий редактор iframe heigth 

    var currentfr=document.getElementById(editor.id + '_ifr');
    if (currentfr.contentDocument && currentfr.contentDocument.body.offsetHeight) { //ns6 syntax
        currentfr.height = currentfr.contentDocument.body.offsetHeight + 26;
    }
    else if (currentfr.Document && currentfr.Document.body.scrollHeight) { //ie5+ syntax
            currentfr.height = currentfr.Document.body.scrollHeight;
    }
...