2013-12-16 4 views
0

javascript wysiwyg 편집기에 대한 질문이 있습니다.Wysiwyg 편집자 : 체인 및 편집기 높이 제한의 편집자가 거의 없습니다

나는 체인에 몇 개의 wysiwyg 편집기를 연결해야합니다.

enter image description here

나는 어떤 순간 (문자 또는 높이 제한)에 커서가 다음 편집기로 이동한다는 것을 의미한다. 다음 편집기가 이미 채워져 있으면 커서가 첫 번째 기호 앞에 점프 (포커스)해야합니다. 사용자가 텍스트를 삭제하는 경우에도 마찬가지입니다. 알로하 편집자 demo for column layout과 같은 것. 체인의 편집자가 다른 레이아웃에서 다른 위치를 가질 수 있기 때문에이 방법을 사용할 수는 없습니다. 예를 들어 :

enter image description here

2 어떻게 편집기 높이 제한을 설정할 수 있습니까? 예를 들어 편집기 높이가 특정 값에 도달하면 사용자가 텍스트를 추가 할 수 없지만 삭제할 수 있습니까? 나는이 구현 이미했지만 하나의 큰 문제가 :

enter image description here

에디터의 높이 제한에 도달하지만, 사용자가 여전히 목록에있는 행에 텍스트를 추가 할 수 있습니다 (화살표로 표시)

이 편집자가 사용되는 (TinyMCE, Alloha, CKEDITOR) 나에게 아무 문제가 없지만 위에서 설명한 모든 것을 구현할 수 있어야합니다.

답변

0

태클에는 많은 부분이 있습니다. 이 모든 작업을 수행 할 편집자는 없습니다 (특히 PDF 생성). 내가 알고있는 확실한 방법은 에디터를 특정 차원으로 고정시키고 컨텐츠가 그 차원 밖에서 생성되는 것을 막을 수는 없지만 다음과 같이 처리 할 것입니다.

모든 요소가 배치되고 크기가 조정 된 페이지를 만듭니다 (위 모형과 같이) 원하는 크기로 조정하고 각 요소를 개별적으로 편집 할 수있게하십시오 (see this example use CKEditor).

그런 다음 스타일을 overflow: hidden으로 설정하십시오. 이렇게해도 사용자는 콘텐츠를 만들 수 있지만 상자의 크기를 벗어나는 모든 것을 숨길 수 있습니다. 그런 다음이 콘텐츠를 렌더링 할 때 같은 overflow: hidden 당신이 보여 싶지 않았다 어떤 내용을 숨기도록 설정하여 요소

  • 모두에 최대 높이를 설정

    • 합니다.

    이렇게 해킹이 가능하지만 문제를 빠르게 해결할 수 있습니다.

  • +0

    PDF 생성 나는 서버에서 만들 것입니다. CSS3 열 레이아웃을 사용할 수 없다고 말하고 싶었습니다. – tuchk4

    +0

    '표시하지 않으려는 콘텐츠를 숨기려면 숨김. '콘텐츠를 숨길 필요가 없습니다. 다음 편집자에게 적합하지 않은 모든 콘텐츠를 이동해야합니다. – tuchk4