如何在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>

現在有幾個問題我無法修復。

第一張：如何讓TinyMCE格式化/對齊div，就像它與img一樣？

其次：如何防止用戶選擇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

回答

相關問題