CKEditor 의 편집창 크기가 입력내용의 유무에 따라 자동으로 조절되는 플러그인입니다. 

 

 

설치위치> ../ckeditor/plugins/autogrow


<환경 설정> 
../ckeditor/config.js

//플러그인 등록 
config.extraPlugins = 'autogrow';

// autogrow 환경 설정 
    config.autoGrow_minHeight = 50;
    config.autoGrow_maxHeight = 600;
    config.autoGrow_bottomSpace = 0;
 

플러그인 다운로드 > autogrow_4.11.1.zip

댓글(2) 남기기...
사진 및 파일 첨부

여기에 파일을 끌어 놓거나 왼쪽의 버튼을 클릭하세요.

파일 크기 제한 : 0MB (허용 확장자 : *.*)

0개 첨부 됨 ( / )

  • dodo 2018.11.15 18:50

    CKEditor 4.11.1 과 autogrow 4.11.1 버전에서 크롬부라우저에서의 한글자모가 이러ㅎㄱㅔ 깨지는 증상이 해결 되었으나 
    Internet Explorer 11 에서 한글 자모가 요ㄹㅓㅎ게 깨지는 증상이 다시 발생 하였답니다. 

    그래서 CKEditor config 파일에서 아래와 같이 브라우저를 선택하여 플러그인을 선택적으로 구동할 수 있도록 적용함. 

        if (agent.indexOf("chrome") != -1) {
            // - 크롬브라우저인 경우 
            config.extraPlugins = 'autogrow';
        } else {
            // - 크롬브라우저가 아닌 경우 autogrow 제외
            config.extraPlugins = ' ';
        }

  • dodo 2018.02.21 16:13

    크롬브라우저에서 autogrow 플러그인 적용시 한글 자모가 연결되지 못하고 이러ㅎㄱㅔ 깨지는 증상이 발견되었습니다. 
    Angle Double Right  이 문제는 해결방법을 찾지 못해 autogrow 플러그인은 포기했습니다. 


xe/common/js/plugins/jquery.fileupload/css/style.css

 

파일 업로드 부분색상 변경 

.xefu-container {
    margin: 10px 0;
    border: 1px solid #404040;
}


 /* dropzone */
.xefu-dropzone {
    padding: 12px;
    border: 0;
    background-color: #555555;


.xefu-btn {
    display: inline-block;
    *display: inline;
    margin: 0;
    padding: 0 12px !important;
    height: 24px !important;
    overflow: visible;
    border: 1px solid #bbbbbb;
    border-radius: 2px;
    text-decoration: none !important;
    text-align: center;
    vertical-align: top;
    line-height: 24px !important;
    font-family: inherit;
    font-size: 12px;
    color: #333333;
    *zoom: 1;
    cursor: pointer;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
    background-color: #f5f5f5;
    *background-color: #e6e6e6;
    background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);
    background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
    background-image: -webkit-gradient(top, #ffffff, #e6e6e6);
    background-image: -o-linear-gradient(top, #ffffff, #e6e6e6);
    background-image: linear-gradient(top, #ffffff, #e6e6e6);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#e6e6e6', GradientType=0);
    filter: progid: DXImageTransform.Microsoft.gradient(enabled=false);
}

 

댓글(0) 남기기...
사진 및 파일 첨부

여기에 파일을 끌어 놓거나 왼쪽의 버튼을 클릭하세요.

파일 크기 제한 : 0MB (허용 확장자 : *.*)

0개 첨부 됨 ( / )


"비밀글입니다."


 

크롬인경우 Angle Double Right   ckeditor/skins/moono-dark/editor.css

.cke_chrome{

display:block;

border:1px solid #454545;

padding:0;

-moz-box-shadow:0 0 3px rgba(0,0,0,.15);

-webkit-box-shadow:0 0 3px rgba(0,0,0,.15);

box-shadow:0 0 3px rgba(0,0,0,.15)

}

CKEditor 전체 외곽 테두리 

ckeditor-테두리.jpg

IE 11 Angle Double Right  ckeditor/ckeditor/skins/moono-dark/editor_ie.css

.cke_chrome{

        display:block;

        border:1px solid #454545;

        padding:0;

        -moz-box-shadow:0 0 3px rgba(0,0,0,.15);

        -webkit-box-shadow:0 0 3px rgba(0,0,0,.15);

        box-shadow:0 0 3px rgba(0,0,0,.15)

}

 

댓글(1) 남기기...
사진 및 파일 첨부

여기에 파일을 끌어 놓거나 왼쪽의 버튼을 클릭하세요.

파일 크기 제한 : 0MB (허용 확장자 : *.*)

0개 첨부 됨 ( / )

  • dodo 2018.02.15 09:44

    에디터 상단 검은라인 추가 

    .cke_chrome{display:block;border:0px solid #454545;border-top: 1px solid #151515;0 0px rgba(0,0,0,.15);-webkit-box-shadow:0 0 0px rgba(0,0,0,.15);box-shadow:0 0 0px rgba(0,0,0,.15)}


ckeditor/skins/moono-dark/editor.css

 

.cke_panel{

visibility:visible;

width:120px;

height:100px;

overflow:hidden;

background-color:#fff;

border:1px solid #333;

border-bottom-color:#999;

-moz-border-radius:3px;

-webkit-border-radius:3px;

border-radius:3px;

-moz-box-shadow:0 0 3px rgba(0,0,0,.15);

-webkit-box-shadow:0 0 3px rgba(0,0,0,.15);

box-shadow:0 0 3px rgba(0,0,0,.15)

}

pannel.jpg

.cke_panel_listItem{

margin:0;

padding-bottom:1px

}

.cke_panel_listItem a{

padding:3px 4px;

display:block;

border:1px solid #ddd;

color:inherit!important;

text-decoration:none;

overflow:hidden;

text-overflow:ellipsis;

-moz-border-radius:2px;

-webkit-border-radius:2px;

border-radius:2px

}* html

.cke_panel_listItem a{

width:100%;color:#000

}*:first-child+html

.cke_panel_listItem a{

color:#000

}

.cke_panel_listItem.cke_selected a{

border:1px solid #dedede;

background-color:#f2f2f2;

-moz-box-shadow:0 0 2px rgba(0,0,0,.1) inset;

-webkit-box-shadow:0 0 2px rgba(0,0,0,.1) inset;

box-shadow:0 0 2px rgba(0,0,0,.1) inset

}

.cke_panel_listItem a:hover,

.cke_panel_listItem a:focus,

.cke_panel_listItem a:active{

border-color:#dedede;

background-color:#f2f2f2;

-moz-box-shadow:0 0 2px rgba(0,0,0,.1) inset;

-webkit-box-shadow:0 0 2px rgba(0,0,0,.1) inset;

box-shadow:0 0 2px rgba(0,0,0,.1) inset

}

ckeditor-listpannel.jpg
 

 

댓글(0) 남기기...
사진 및 파일 첨부

여기에 파일을 끌어 놓거나 왼쪽의 버튼을 클릭하세요.

파일 크기 제한 : 0MB (허용 확장자 : *.*)

0개 첨부 됨 ( / )


목록
Board Pagination Prev 1 ... 18 19 20 21 22 23 24 25 26 27 28 Next
/ 28
rhwlsghkcocndgus XE1.9.2 STAGE1.5.2
서버에 요청 중입니다. 잠시만 기다려 주십시오...