setAutoWidthForButtons.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/notes/styleNotes.js')

         

     DFrameAPI.onLoad = function(){   

    

          var style = new DFrameStyle(dFrameStyle)

          var x = style.getDefaultBarStyle().getDefaultButtonStyle()

          //basePathForIcons is defined in styleNotes.js

          x.setImageNormal(basePathForIcons+'close.gif')

          x.setImageRoll(basePathForIcons+'closeDown.gif')

          x.setImageDown(basePathForIcons+'closeDown.gif')

          x.setImageSelected(basePathForIcons+'closeDown.gif')

          x.setImageRollSelected(basePathForIcons+'closeDown.gif')

          x.setAutoWidth('IMAGE')                     

 

          var dFrame = new DFrame([10, 10, 40, 40], 'setAutoWidth.html - 1', style)                       

          dFrame.addButton('', 'alert("Click !")')

          dFrame.addButton('', 'alert("Click !")')

          var txt = 'The Buttons above have a fixed width set to 80<br>with the setWidth() method in styleNotes.js .'

          txt += '<br><br>You can understand the wrong spacing if<br>you roll over the images.'                

          dFrame.alert(txt)

 

          x.setWidth(1) 

          var dFrame = new DFrame([50, 50, 80, 80], 'setAutoWidth.html - 2', style)                       

          dFrame.addButton('', 'alert("Click !")')

          dFrame.addButton('', 'alert("Click !")')

          dFrame.alert('The style of those one have a fixed width set to 1<br>and can thus be adjusted to the width of the<br>image they contain.')             

 

     }

</script>

</HEAD>

</HTML>