*Note the PDF I'm using is 500x500. By adjusting the settings it frames the PDF neatly.Code:demos.Aeolian = new Ext.Panel({ scroll: 'vertical', layout: { type: 'vbox', pack: 'stretch' }, items: [ { html:''}, { html: '<div><img src="resources/scalePNGs/CircleOfFifths.png" width="600" height="500" /><h1>Music Theory 101</h1><p><br /><br /><br /><span>MT101 β (1.0)</span></p></div>' }, { xtype: 'button', text: 'Launch Overlay', handler: function() { if (!this.popup) { this.popup = new Ext.Panel({ floating: true, modal: true, centered: true, width: 613, height: 660, styleHtmlContent: true, html: '<center><embed src="resources/scalePDFs/AminorAeolian.pdf" width="575" height="575"></embed></center>', dockedItems: [{ dock: 'top', xtype: 'toolbar', title: 'Overlay Title' }], scroll: 'none' }); } this.popup.show('pop'); } } ] });
*Note by using a 3D authoring application, and publishing to PDF, it is possible to display objects that resemble .pdb molecule viewers.