TinyMCE에서 div를 img처럼 동작시키는 방법

팝업 라이트 박스의 사진/비디오를 TinyMCE에 삽입하는 플러그인을 작성했습니다. 이것은 잘 작동하고 배열/포장 될 때 매우 잘 포맷됩니다. 그것은 다음과 같은 HTML에 삽입 된 경우 :TinyMCE에서 div를 img처럼 동작시키는 방법

<img src="blah.png" />

하지만 같은 래퍼 DIV를 사용하여 자막, 수 있도록 기능을 추가 이후 :

<div class="ImageWrapper" width="x" height="x"> 
    <img src="blah.png" /> 
    Caption here 
</div>

지금 몇 가지 문제가 있습니다를 I 고칠 수 없다.

첫 번째 : TinyMCE가 img에서와 같이 div를 포맷/정렬하도록 허용하려면 어떻게해야합니까?

둘째 : 사용자가 div의 내용을 선택하지 못하게하려면 어떻게해야합니까? 대신 전체 div를 클릭하여 서식을 지정하고 삭제하면 훨씬 더 원활하게 작동합니다.

출처

2011-10-20 Joe S

'img' 태그의 CSS를보고'div.ImageWrapper'를 같은 코드에 추가하십시오. – Blender

죄송합니다, 무슨 뜻인지 이해가 확실치 않습니다. img 태그의 스타일을 지정하기위한 명시적인 CSS가 없습니다. 포맷팅의 차이는 브라우저 또는 TinyMCE 자체에서 발생합니다. div 태그에 img 태그와 동일한 스타일 동작을 적용 할 수 있습니까? –

Chrome의 Inspector 또는 Firebug에서 'img' 태그에 적용된 CSS 코드를 확인하십시오. 줄 번호 등을 알려야합니다. 해당 CSS를 모두 복사하여 div에 적용하십시오. – Blender

문제는 <div>을 TinyMCE에서 자연스럽게 지원하지 않는 래퍼로 사용하는 것입니다. 당신은 어떤 CSS로 안절부절 못하는 것 이상으로 나아가 야합니다. TinyMCE는 대중적인 편집자이기 때문에 사람들은 이미 적절한 해결책을 시도하고 있습니다. http://www.tinymce.com/forum/viewtopic.php?id=20319
그리고 당신은 'TinyMCE에 DIV 플러그인'에 대한 구글 경우가 더 많은 정보를 많이 찾을 수 있어요 : 여기에 플러그인을 작성하는 사람입니다 나는 당신의 상황에 가장 적합한 것이 무엇인지 모르는 http://www.google.com/#q=tinymce+div+plugin

, 그래서 것 같아요 당신은 제안 된 솔루션 (plpugins) 중 일부를 시도해야합니다.

출처

2011-11-08 09:01:52 kasimir

TinyMCE에서 div를 img처럼 동작시키는 방법

답변

관련 문제