help with making colored js button box translucent

help with making colored js button box translucent (Full Version)

All Forums >> [Web Development] >> Cascading Style Sheets

Message

pintofale -> help with making colored js button box translucent (5/25/2008 1:06:27)

i have a dragable text box given by:

<div id="window" style="position:absolute; z-index:10; left:1000px; top:50px; width:150px background-color:#dde3eb; border:1px solid #464f5a;"> 
    
   <div style="padding-bottom:8px; width:150px; background-color:#718191; border-bottom:1px solid #464f5a;" onMouseDown="beginDrag(this.parentNode, event);"> 

      <div style="position:absolute; top:8px; left:5px; font-size:16px; font-weight:bold; color:#FF0000;">Drag me!</div>
       
   </div>
<br/> 
   <div style="margin-left:20px;"><INPUT TYPE="button" style="height: 24px; width: 100px" VALUE="Print" onClick="submitFunction(1)"></div>    
   <div style="margin-left:20px;"><INPUT TYPE="button" style="height: 24px; width: 100px" VALUE="Archive" onClick="submitFunction(2)"></div>
   <div style="margin-left:20px;"><INPUT TYPE="button" style="height: 24px; width: 100px" VALUE="Delete" onClick="return confirm('Continue? Yes or No'),submitFunction(3)"></div>
   <div style="margin-left:20px;"><input type="button" style="height: 24px; width: 100px" onclick="SetAllCheckBoxes('theForm', 'mycheckbox', true);" value="Select All"></div>
   <div style="margin-left:20px;"><input type="button" style="height: 24px; width: 100px" onclick="SetAllCheckBoxes('theForm', 'mycheckbox', false);" value="Unselect All"></div>
   <div style="margin-left:20px;"><input type="button" style="height: 24px; width: 100px" onclick="window.navigate('page.asp?page=admin')" value="ADMIN"></div>
<br/> 

</div>

Can anyone help me with how to make to the color of the box tranlucent.

ie how i might change the following:

background-color:#dde3eb;

I looked for some solutions on google but nothing came up right away. Any ideas would be great.

Tailslide -> RE: help with making colored js button box translucent (5/26/2008 6:14:06)
When you say translucent - do you mean totally transparent so you can see the colour behind (if so then just don't have a background colour declared or use transparent. If you mean you want it semi-opaque then you need to look at CSS opacity: http://www.mandarindesign.com/opacity.html Be careful though make sure you test in Firefox, Opera and IE to ensure you've got it working cross-browser. An easier way is to just create a background image using the semi-opaque background colour. Obviously doesn't work if you have any text or anything under it but works fine for solid plain background.

d a v e -> RE: help with making colored js button box translucent (5/26/2008 6:29:44)
or a checkerboard gif made up of 10px x 10 px with one alternate white and transparent squares set as a repeating background

Page: [1]

4.699707E-02