Note that there are some explanatory texts on larger screens.

plurals
  1. POHow do I hide the TinyMCE Toolbar onBlur without deactivating the Rich Text Editor entirely?
    text
    copied!<p>I am attempting to hide the TinyMCE Toolbar when a user clicks on another page element and leaves the text area (so essentially onBlur). I have found solutions that will Deactivate the Rich Text Editor functionality onBlur, but I need to only hide the toolbar and leave the Rich Text display (rather than plain text with html tags).</p> <p>Any suggestions would be greatly appreciated...thanks!</p> <p>This is what I have now: (it uses the external toolbar)</p> <pre><code>&lt;html&gt; &lt;head&gt; &lt;!-- TinyMCE --&gt; &lt;script type="text/javascript" src="../jscripts/tiny_mce/tiny_mce.js"&gt;&lt;/script&gt; &lt;script type="text/javascript" src="jquery.js"&gt;&lt;/script&gt; &lt;script type="text/javascript"&gt; tinyMCE.init({ mode : "textareas", theme : "advanced", plugins : "safari,pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template", theme_advanced_buttons1 : "fontselect,fontsizeselect,|,bullist,numlist,|,outdent,indent,|,blockquote,image,code,|,fullscreen", theme_advanced_buttons2 : "bold,italic,underline,strikethrough,sub,sup,hr,|,forecolor,backcolor,|,justifyleft,justifycenter,justifyright,justifyfull,|,link,unlink", theme_advanced_buttons3 : "tablecontrols,|,charmap", theme_advanced_toolbar_location : "external", theme_advanced_toolbar_align : "left", theme_advanced_statusbar_location : "bottom", theme_advanced_resizing : true }); &lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;form method="post" action="somepage"&gt; &lt;br /&gt; &lt;br /&gt; &lt;br /&gt; &lt;br /&gt; &lt;br /&gt; &lt;textarea name="content1" id="content1" style="width: 500px;"&gt; This is some sample &lt;b&gt;&lt;u&gt;content&lt;/u&gt;&lt;/b&gt;. &lt;/textarea&gt; &lt;br /&gt; &lt;br /&gt; &lt;a href="javascript: void(0);" onclick="tinyMCE.getInstanceById('content1').toolbarElement.style.display = 'none'"&gt;Hide Toolbar&lt;/a&gt; &lt;/form&gt; &lt;/body&gt; &lt;/html&gt; </code></pre>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload