Embedded Object Transparency

mrdee

Dec 19 2007, 03:27 PM

Hi,
does anyone know if it is possible to make a control panel of an embedded object transparant, and if so, could you let me know how it is done?

I put a piece of music on my web site earlier, with a control panel to adjust the volume, start/stop etc.
The problem is, I have also put a Christmassy background on the site and the white area around the control panel makes it look somewhat untidy.
Here is the code I used for the embedding:

CODE

If anyone knows a solution to my problem I would be extremely grateful.

Thanks in advance.

sonesay

Dec 19 2007, 06:50 PM

this should work

CODE

<div align="center"><embed style="display:none" src="Music/Stille Nacht.mp3" width=150 height=115 autostart=true align="center" loop="true"></div>

mrdee

Dec 19 2007, 09:11 PM

Thanks for your reply, sonesav.
But I'm afraid it has made no difference.

Thanks anyway.

sonesay

Dec 19 2007, 09:18 PM

that code did hide the player on my test. can i see a link to your page?

mrdee

Dec 19 2007, 09:23 PM

Sure,
it is http://www.vlaanderen-flanders.org.uk

On the opening page, click on "English" (I assume that is what you wil want to read), and on the next page, click "News" on the menu, which is where the music file is.

Thanks.

sonesay

Dec 19 2007, 09:31 PM

I checked out your code on your site

CODE

<embed width="150" height="115" align="middle" loop="true" autostart="true" src="Music/Stille Nacht.mp3" style=""/>

style has no value thats probably why. worse case i think if you assign values of 0 to height and width it will hide it lol. or else you can always try assigned the style attribute to the div tag I'm sure it can work there also. if that still dosent work you can always move that div -100 px out of the screen or something.

mrdee

Dec 19 2007, 10:04 PM

I don't know how that is possible.
upon inspection of my code I get this:

CODE

Just like you passed it on.

Weird.

sonesay

Dec 19 2007, 10:09 PM

you definitely need a : in between style="display:none"

make sure its like this

CODE

style="display:none"

if that still dont work try

CODE

style="display:none;"

The first seems to work for me on my local server. maybe its just my broswer rendering it incorrectly and allowing any errors to pass. I'll check again

mrdee

Dec 19 2007, 10:22 PM

I see, I had indeed missed the colon out.
However, when I did slot it in, the panel was gone, but so was the music.
You see, what I meant was, around the panel there is a white square that clashes with the background.
I do prefer to have a panel where people can turn the music off if they like, or adjust the volume.
What I did ask, really, was whether you could make that panel and its surroundings transparant, so that the background comes through.

Thanks.

sonesay

Dec 19 2007, 10:35 PM

sorry bud, I never read things properly so its the ugly white space you want to get rid of? I think its caused by the height attribute

CODE

height="115"

I think if you lower it it may get rid of the white space but I think this method may have another problem since different broswers will render it differently.
yeah I jsut noticed under firefox you will see the white box but under safari it will show only the control bars.

I guess a more proper way is to remove background off the <embed> tag

you can try

CODE

<embed style="background:none;"

or
or

CODE

<embed style="background:none"

I'm not sure whats more correct with a ';' or without. hope that works for you.

edit: dosent seem to work

I'll keep trying this is a annoying little problem.

Embedded Object Transparency - Making an object transparent

Embedded Object Transparency - Making an object transparent