PDA

View Full Version : Desktop Example, misc artifacts appearing



mcahill81
17 Nov 2009, 10:53 AM
I'm modifying the Desktop example to work from.

I moved the 'ux-taskbar' div to be above the 'x-desktop' element in the desktop.html file

desktop.html


<div id="ux-taskbar">
<div id="ux-taskbar-start"></div>
<div id="ux-taskbuttons-panel"></div>
<div class="x-clear"></div>
</div>
<div id="x-desktop">
<dl id="x-shortcuts">

</dl>
</div>
</div>
In the TaskBar.js (line 31) file I modified the startBtn's menuAlign option from 'bl-tl' to 'tl-bl'..


this.startBtn = new Ext.Button({
text: 'Start',
id: 'ux-startbutton',
iconCls:'start',
menu: this.startMenu,
menuAlign: 'tl-bl',
renderTo: 'ux-taskbar-start',
clickEvent: 'mousedown',
template: new Ext.Template(
'<table cellspacing="0" class="x-btn {3}"><tbody><tr>',
'<td class="ux-startbutton-left"><i> </i></td>',
'<td class="ux-startbutton-center"><em class="{5} unselectable="on">',
'<button class="x-btn-text {2}" type="{1}" style="height:30px;">{0}</button>',
'</em></td>',
'<td class="ux-startbutton-right"><i> </i></td>',
"</tr></tbody></table>")
});
Upon clicking on the "Start" button I have a mysterious artifact (it looks like a bottom border is extended somewhere)
http://www.natator.com/images/example_screenshot.jpg