MarvinSketch html layout problem using marvin.js from v5.3.6

User 1f6fd578ec

21-07-2010 16:39:03

Hi


I have recently updated from MarvinSketch version 5.2.4 to 5.3.6 and noticed a new problem with the html layout of the pages in my application that embed a MarvinSketch applet. It seems that when the marvin.js script is referenced via a script tag placed in certain locations in the HTML it shifts the page contents down by approximately one 'line'. This occurs in Firefox 3.6.7 on Vista, and IE6 on Windows Server 2003, I didn't test any other platforms...


Having investigated further it seems that marvin.js now incorporates new code from the Java deployment toolkit at http://java.sun.com/js/deployJava.js and this seems to be causing my problem. I've tracked it down to the <embed hidden="true" type="application/java-deployment-toolkit" id="deployJavaPlugin"> tag emitted by this javascript - in some scenarios it occupies space (even though the applet is hidden).


The workaround for this is to move your script tag referencing marvin.js to some point in the HTML where you can absorb this extra space without destrying your layout. I don't know if it's a browser bug, scripting error in the Sun code, or a 'known feature' of <embed ../> tags, but it's a bit of a pain.


I've attached a sample page based on the applet embed sample supplied with sketch. To reproduce the problem move the line:


<script type="text/javascript" language="javascript1.1" src="../../../marvin.js"></script>


above the <h1> tag, and you should see the header move down a line. You can verify with Firebug that the element causing the problem is the hidden embed tag by using firebug to manually remove it from the rendered page.


I've been able to move my script tag out of the way but hopefully this might help you fix it / help someone else in the same situation...


 


Regards


Tom

ChemAxon 5433b8e56b

27-07-2010 15:54:12

Hi Tom,


as i tested it this is a bug or feature in the heading tag. If you place heding to the top of the page, then it has not got top margin but if you place something before the heading tag it will get a top margin that has the same size as its bottom margin, even if the element above the heading is invisible.


You can try this with a div which has a style="display: none" attribute also.


The simplest solution is to manually set the top margin, and top padding of the heading to 0px.


Before we added deployJava to marvin.js, the js code did not place anything to the html body, and therefore this behaviour was hidden.


Best regards,
Istvan