newDFrame.html
<HTML>
<HEAD>
<script>var
dFrameFilePath = '../../../../../dFrame/'</script>
<script
language="Javascript"
src="../../../../../dFrame/dFrame/lib/DFrameAPI.js"></script>
<script
language="Javascript">
//Style
DFrameAPI.include('dFrame/styles/blue/styleBlue.js')
DFrameAPI.onLoad = function(){
var dFrame = new DFrame([10, 10, 90, 90], 'newDFrame.html',
dFrameStyle)
barStyle.setHeight(20)
barStyle.setWidth(20)
var color = ['blue', 'yellow', 'green']
//add 16 bars
for (var i = 0 ; i<3 ; i++) {
barStyle.setBackgroundColor(color[i])
dFrame.addBar('', 'TOP', barStyle)
dFrame.addBar('', 'RIGHT', barStyle)
dFrame.addBar('', 'BOTTOM', barStyle)
dFrame.addBar('', 'LEFT', barStyle)
}
//dFrameStyle.setBackgroundColor('red')
var dFrame1 = new DFrame([1, 2, 49, 98], 'First DFrame',
dFrameStyle, dFrame)
dFrame1.setBackgroundColor('red')
barStyle.setAutoWidth('')
barStyle.setAutoHeight('')
barStyle.setBackgroundColor('white')
barStyle.setHeight(100)
dFrame1.addBar('',barStyle, 'TOP')
grid(dFrame1)
dFrame1.addBar('floating 1', barStyle, [40, 40, 60, 60])
dFrame1.show()
//dFrameStyle.setBackgroundColor('black')
var position = [null, 2, 99, 98]
position[0] = [dFrame1,'RIGHT',5]
var dFrame2 = new DFrame(position, 'Second DFrame',
dFrameStyle, dFrame)
grid(dFrame2)
dFrame2.setBackgroundColor('black')
dFrame2.addBar('floating2',barStyle, [40, 40, 60, 60])
dFrame2.show()
}
function grid(dFrame) {
barStyle.setBackgroundColor('yellow')
barStyle.setBordersWidth(0)
dFrame.addBar(barStyle, [20, 0, '1', 100])
dFrame.addBar(barStyle, [40, 0, '1', 100])
dFrame.addBar(barStyle, [60, 0, '1', 100])
dFrame.addBar(barStyle, [80, 0, '1', 100])
dFrame.addBar(barStyle, [ 0, 20, 100, '1'])
dFrame.addBar(barStyle, [ 0, 40, 100, '1'])
dFrame.addBar(barStyle, [ 0, 60, 100, '1'])
dFrame.addBar(barStyle, [ 0, 80, 100, '1'])
}
</script>
</HEAD>
</HTML>