Page 1 of 2

Transparent Buttons for menu

PostPosted: Fri Feb 25, 2011 6:18 am
by chrisg_75
Hi,

I have tried to use my own buttom image for a menu i am making. I produced a button in photoshop which had a gradient fill from centre outwards to top and bottom going from colour to transparent and saved it as png. Intention to have the button name in the colour portion with the page background blending in to the transparent portion ofthe button.

However, when produced on my web page the transparent portion is white or grey and doesnt blend in with my background. Any help. ?? is it how i saved it in photoshop ?

Hopefully it is possible.

cheers
chris

Re: Transparent Buttons for menu

PostPosted: Fri Feb 25, 2011 9:50 am
by Aivars
Did you select Image file format: PNG when you exported the project? GIF files don't support partial transparency and instead are blended with a single (background) color.

If this does not solve it, could you send me the link to page with the menu or the image/menu project files for testing? If you don't want to make these links public, you can send them as private message or via our support system (http://www.blumentals.net/support/wizard.php)

Re: Transparent Buttons for menu

PostPosted: Fri Feb 25, 2011 1:56 pm
by chrisg_75
Hi

Here is a test page with the menu overlapping the header portion of the background

I originally wanted the menus across this area and as such wanted the buttons to be transparent to show through the background across the top but i had to replace because it wasn't working. I put a copy of the menu over this area again to show you.

http://www.syi.net.au/test1/14DigitalFiles.html

Cheers
Chris

Re: Transparent Buttons for menu

PostPosted: Fri Feb 25, 2011 2:22 pm
by Aivars
Are you sure it's not working? This is how I see it:
Image

What browser are you using?

Re: Transparent Buttons for menu

PostPosted: Fri Feb 25, 2011 10:44 pm
by chrisg_75
that is how i see it also, however, the grey portion of the buttons should not be there, it shoul dbe going from the blue through to transllucent, not the grey transition.

Re: Transparent Buttons for menu

PostPosted: Sat Feb 26, 2011 2:50 pm
by Aivars
Can you send me (or put online) the original button image as Photoshop saved it? Thanks.

Re: Transparent Buttons for menu

PostPosted: Tue Mar 01, 2011 5:32 am
by chrisg_75
PM Sent

Re: Transparent Buttons for menu

PostPosted: Fri Mar 11, 2011 12:49 am
by chrisg_75
Any luck with the button ?
cheers
chris

Re: Transparent Buttons for menu

PostPosted: Fri Mar 11, 2011 10:35 am
by Aivars
Yes, fixed, tested & committed - waiting for deployment to website. I will let you know.

Re: Transparent Buttons for menu

PostPosted: Sun Mar 13, 2011 11:47 pm
by chrisg_75
ok cool
thanks for your help lookf orward to it

cheers
chris

Re: Transparent Buttons for menu

PostPosted: Thu Mar 08, 2012 12:52 am
by rarmy
This thread seems to be a good place to ask this...

I usually have colored textures on my web pages, thus would like to make menu's with a border and label, but transparently floating across the background. I see that I can set "Half-Transparent" in the Misc Tab, but is there a way to set 100% transparent???

Re: Transparent Buttons for menu

PostPosted: Thu Mar 08, 2012 7:29 am
by Aivars
Normally in standard webpages fully transparent submenus would look terrible (submenu text would merge with page text and become unreadable) so we have never considered adding this feature.

Re: Transparent Buttons for menu

PostPosted: Thu Mar 08, 2012 7:32 am
by Aivars
However, if you really want to do this or see what it would look like, open CSS file manually (with HTMLPad or any other editor) and find a block like this:

.ebul_mb?????? tr {
background-color: #SOMECOLOR;
cursor: pointer;
font-size: 1px;
}

and change #SOMECOLOR to transparent.

Re: Transparent Buttons for menu

PostPosted: Fri Mar 09, 2012 3:33 am
by rarmy
Aivars wrote:However, if you really want to do this or see what it would look like, open CSS file manually (with HTMLPad or any other editor) and find a block like this:

.ebul_mb?????? tr {
background-color: #SOMECOLOR;
cursor: pointer;
font-size: 1px;
}

and change #SOMECOLOR to transparent.


Seems easier than what I was doing last night...I used the background image as the Button Image, seemed to work, but your right, I have floating text on top of my web-page...no matter what I do, am unable to get a border around the buttons...I think if I can do that it might look better instead of floating text...Hmmm...

Re: Transparent Buttons for menu

PostPosted: Fri Mar 09, 2012 3:48 am
by rarmy
Aivars wrote:However, if you really want to do this or see what it would look like, open CSS file manually (with HTMLPad or any other editor) and find a block like this:

Code: Select all
.ebul_mb?????? tr {
    background-color: #SOMECOLOR;
    cursor: pointer;
    font-size: 1px;
}


and change #SOMECOLOR to transparent.


So...as I look at the css file that goes with the menu, is there a map of menu to css entries??? Was thinkin I have to add a border manually via css...