jsme
Version:
JSME is a free molecule editor written in JavaScript. JSME is a direct successor of the JME Molecule Editor applet. JSME supports drawing and editing of molecules and reactions on desktop computer, as well as on handheld devices including iPhone, iPad and
55 lines (40 loc) • 1.64 kB
HTML
<html>
<head>
<script type="text/javascript" language="javascript" src="jsme/jsme.nocache.js"></script>
<script>
//this function will be called after the JavaScriptApplet code has been loaded.
function jsmeOnLoad() {
//hide the DIV first
document.getElementById("jsme_container").style.display="none";
//draw the applet: no problem the size is specified
jsmeApplet = new JSApplet.JSME("jsme_container", "380px", "340px");
document.getElementById("jsme_container2").style.display="none";
//second example: the size is specified in % and cannot be computed if the DIV is hidden
//thus a repaint() call must be performed after the applet has been displayed
jsmeApplet2 = new JSApplet.JSME("jsme_container2", "100%", "80%");
}
</script>
</head>
<body>
<h1>JSME in a hidden div</h1>
<h2>The size is fixed (defined in px)</h2>
<button name="button" onClick='document.getElementById("jsme_container").style.display="inline"'>Show</button>
<button name="button" onClick='document.getElementById("jsme_container").style.display="none"'>Hide</button>
<BR>
<BR>
<HR>
<div id="jsme_container"></div>
<BR>
<BR>
<HR>
<h2>The size is dynamic (defined in %)</h2>
Note: jsmeApplet2.repaint() must be called after displaying.
<BR>
<button name="button" onClick='document.getElementById("jsme_container2").style.display="inline";jsmeApplet2.repaint()'>Show</button>
<button name="button" onClick='document.getElementById("jsme_container2").style.display="none"'>Hide</button>
<BR>
<BR>
<HR>
<div id="jsme_container2"></div>
</body>
</html>