transparent background

34 posts | return to the Skins forum | get the rss feed for this thread

Dec. 19, 2008Moises Zaragoza

I was wondering if there is any way I can make the default color of the background transparent?

Dec. 27, 2008Anon

Try putting the param:
wmode=transparent in the flash player object.

Dec. 27, 2008Jimb

@Moises

The wmode won't do the trick. You have to modify the action script to get the effect you're asking for.

Here is an example. http://mymail.playourvideo.net/stransparent.htm?id=forum.flv&tv=character.flv

Regards - Jimb

Dec. 31, 2008ChrisC

Jimb your video wouldn't work but I'd love to see it to know how to modify the FLA for a transparent background.

Dec. 31, 2008Jimb

@ChrisC

Hmmm... Sorry you weren't able to watch the video. Not sure when you made your attempt but the server may have been offline for maintenance. You might want to make another attempt as all is working as expected. That page usually get viewed about 30 times a day. It has been tested with IE, Firefox, Opera, Safari and Chrome with no problems on Windows computers. I don't have a Mac or Linux platform to test with. The transparent file only requires you have version 8 or newer of the Flash Plugin.

As to how to modify the action script it depends on what version of the player you are using. In version 3 I needed to add 2 flashvars and modify 3 of the actionscript files. It's much simpler in version 4. All that's needed is 1 new flashvar and adding 3 lines of code to 1 of the actionscript files.

If you take the time to tell me the version you want, I'll be happy to post the code.

Regards - Jimb

Jan. 08, 2009mustafa

@Jimb

can you post the code for the latest 4.3 version?

regards,
mustafa

Jan. 12, 2009Jimb

@Mustafa

Since you are asking about 4.3.133 no modification is necessary. You can use the screenalpha flashvar in your player script. You pass it a number 0 being completely transparent.

Regards - Jimb

Jan. 13, 2009OlafG

Okey, I am new at this. Where do I add the code?


Current code:
<script type="text/javascript">
var s1 = new SWFObject("player.swf","ply","800","300","9","#000000");
s1.addParam("allowfullscreen","true");
s1.addParam("allowscriptaccess","always");
s1.addParam("flashvars","file=dynasti.flv&image=img.png");
s1.write("player");
</script>

What Do I need to modify to remove the controlbar and only keep the play button the image? Or atleasy skin it a bit.

Jan. 13, 2009tonk

tutorials at the top of the page...

http://www.longtailvideo.com/support/tutorials/Embedding-Flash


documentation here...

http://developer.longtailvideo.com/trac/


all flashvars here...

http://developer.longtailvideo.com/trac/wiki/FlashVars

Jan. 22, 2009Vasim Padhiyar

how to display the video playlist in player with small image like youtube featured video player ?

Is it posible to display such list. when i click on any video of playlist than it should be play in player...

please replay.

from : vasimpadhiyar@yahoo.com

Jan. 28, 2009jb1013

@Jimb

Can you post the code necessary for making the screen transparent for version 3.17

You can see what I'm working on here:

http://www.gailtrobertson.com

You'll notice when the slideshow shows an image that doesn't fill the entire screen, that it looks a bit awkward. I would really love it, if I could get the textured background of the page to show instead of a solid color.

FYI, this is working in conjunction with NextGen Gallery plugin for Wordpress.

Thanks!

Jan. 28, 2009lefTy

@jb1013,

You might want to set showicons=false so the loading icon doesn't show when each image is being loaded.

      http://developer.longtailvideo.com/trac/wiki/Flashvars3#Displayappearance

Feb. 03, 2009Shinyman

Hello all!...HELP!!!

I am tryin to have my player have a transparent background so when it is resized the background image of the webpage will show thru the player...here is my current code...can anyone help? =)

Code:
<embed src="GoNewsNOW_Video_Player/GoNewsNOW-Player.swf" width="100%" height="100%" bgcolor="" allowscriptaccess="always" allowfullscreen="true" flashvars="author=GoNewsNOW!&description=Go News NOW! Video&file=http://www.GoNewsNOW.net/GoNewsNOW_News_Videos/GoNewsNOW_Show_Introduction.flv&image=http://www.GoNewsNOW.net/GoNewsNOW_Video_Player/GoNewsNOW_Player_Screen.jpg&title=GoNewsNOW!Video&type=video&backcolor=000000&frontcolor=FF9900&lightcolor=FFFF00&screencolor=333FFF&bufferlength=3&volume=100&controlbar=over&autostart=true&stretching=uniform&screenalpha=yes&abouttext=About GoNewsNOW! Go News NOW!&aboutlink=http://www.GoNewsNOW.net/About/Go-News-NOW-About.shtml"></embed>

Thanks for anything you can offer.

Kevin
=)

Feb. 03, 2009Jimb

@jb1013

I think if you go to this thread & follow the instructions show in the 5th posting it should work for you just fine.

http://www.longtailvideo.com/support/forum/JavaScript-Interaction/11456/How-to-add-text-overlays-on-a-video#msg73245

Not tested on 3.17 as I'm working on other projects but the code was for version 3.16 I don't remember if anything that would effect the functionality changed between 3.16 and 3.17 but I don't think so

Regards - Jim

Feb. 03, 2009Shinyman

Thanks for the tip...however...I must confess I am a little less technical than that process allows for. =)

Perhaps I am not expressing my needs clearly...I only need the area AROUND the video to be transparent...not area actually within the video.

Any clarification for me would be HUGE!

Thanks for you effort!

Kevin
=)

Feb. 03, 2009Jimb

@Kevin

If you are not fighting an issue where the player is obstructing the view of other content on the page perhaps you are having difficulty placing that content in an area that is not within the boundries of the area occupied by the playeitself. If that is the issue, then CSS is your friend.

Regards - JImb

Feb. 06, 2009Shinyman

Excellent point. If i may show you the page i am working on...all will be clear. The link is http://www.GoNewsNOW.net/index-TEST.shtml

...you can see that I am inserting the player to match the layer it is in at 100%...then using the "stretching=uniform" variable to place the video in the player...this leads to the "BLUE" borders either on the sides or top of the actual uniform video. These blue areas are what I am trying to eliminate so the background webpage can be seen thru the player.

Tricky? Sure has been for me to figure out. Let me know if the CSS is still the best answer.
...and thanks sooooo much for you effort on this with me.

Kevin
=)

Feb. 06, 2009Jimb

@ Kevin

I suspect if you change you stretching flashvar to "exact" you may achieve what you want.

You may need to resize your picture (image flashvar) so it does not distort.

Regards - Jimb

Feb. 07, 2009Shinyman

Welp...I tried that one...still not the desired effect.
I thank you for your ongoing help with this...and I thought it would be simple!!? =)

I will describe the desired outcome better here...When you insert a JWplayer there are 2 sizes to be considered, One the size of the player on the screen (which I need to be dynamic and adjust with the window that it is playing within...and two...the actual video size that is playing within the player. What I am seeing is when I use the "Uniform" flashvar...any remaining area within the player's area itself becomes colored blue...and not transparent. I need to make this blue area transparent so the background may be seen thru the player in all cases and altered window sizes. Perhaps the player does not allow for this...and the video and player must be set to the same size.

That's about the best way I can verbalize the objective here.

Thanks again for your ongoin effort! =)

Kevin
=)

Feb. 07, 2009Shinyman

...and here's one more thought...is there a way to set the JW player to automatically detect the proportions of the video it is playing so that it may then adjust itself in realtime to eliminate the border colors?

That would allow the player to adapt to any and all internet browser window sizes in realtime and all provide for a borderless and therefore "transparent" surround.

Kev
=)

Feb. 07, 2009Randall

Jimb, I have a question for you. I'm trying to get transparent backgrounds to work in the player (a series of live 'talking head' videos), and I'm not having any luck. You said in an earlier post that ever since 4.3, all that's necessary is adding the screenalpha=0 flashvar to the player script. I did that, and the transparency isn't working.

EDIT: I forgot to mention that adding the screenalpha=0 flashvar does make a difference. When I add it, the background of the videos turns white (with artifacts from the green screen visible). When I remove it, the background goes back to black. These videos were encoded by someone else and given to me. If I embed them in Flash with Dreamweaver's built in Flash video embedding as a single video (and set wmode to transparent), the transparency works fine. It's just not working properly in the JW player.

Are there any other steps I need to take, any other code I need to modify?

When I right click on the player, it says I'm running version 4.3.132. Do I need a version 4.3.133 to get the screenalpha flashvar working, and if so where would I find it?

I would really appreciate any input.

Feb. 08, 2009Jimb

@Randall

If you go to my website http://mymail.playourvideo.net and send me a text message I'll get back to you. If you can, I'd like about 5 seconds of one of your transparent files so that I may analyze it. Then, if your file is allright, I'll build a test page for you so you can copy and paste things into you own web site. Not sure about which specific version is required so I'll look into that and post a link to the proper player download so you'll know for sure it has the feature.

Use this link and download the entire 4.3 package. Then you'll be sure it has the faeture. http://developer.longtailvideo.com/trac/browser/tags/mediaplayer-4.3

By the way, if you have a bgcolor specified in your script, remove it as that would also cause what you describe. One last thought, did you set wmode to transparent?

Regards - Jimb

Feb. 08, 2009Randall

Jimb, thanks for your quick response and helpful advice. I really appreciate your offer but I wouldn't want to burden you with it. The owner has actually decided to structure the site in a different way, so I won't be needing to use the player for transparency.

Thanks again. I'm new to the community and I can already see you're a great help to it.

Feb. 08, 2009Kevin

Jimb?...Anyone? I have refined my question for you!...

Is it possible to make the Flashvar "screencolor=" be transparent? As the 4.3 player now works, when you set the Flashvar "stretching=" to uniform the end result is colored boxes on either the sides or the tob/bottom when stretching the web browser.

Ideally the video would stretch uniformly and there would be transparent sides/top bottom around it.

HELP!!!
...and thanks.

Kevin
=)

Feb. 08, 2009Jimb

Hmmm Ever wonder what would be there in place of the colored box. Would you expect to see an inside view of the back of your monitor? Just kidding of course. There will always be something there though.

Even If you set screenalpha to 0, have not defined a background color, and set the wmode to transparent I think you still have a problem UNLESS you set stretching to exactfit or the player is the same size as your video.

Exactfit will fill the player area completely with your video but will distort it slightly if it is anything other than the size of your actual video's diminsions. Perhaps you are trying to display content that was formatted for widescreen but you captured it of DVD or TV. You can definitely do that. Just Crop the video eliminating the bars accross the top and bottom before you produce your flv or mp4. Then you don't need to concern yourself with transparency in the first place. Just the size of the player. Here's an example of that. http://mymail.playourvideo.net/widescreen.htm?id=eotl.mp4

That's why I always define the player to be the size of the video. Then there is no problem.

Here is an example. http://mymail.playourvideo.net/jtransparent.htm?id=studio.flv
If you download the video you will see it is 720 x 480 as is the player. This video was shot with me in front of a green screen. Then the green was keyed out and the entire background including the tv playing behind me is all just dropped into compositing software to create the illusion. Finally an FLV is created with the encode alpha channel option selected. Very much the same way as your local weatherman shows you the weather map.

Had I not dropped in an artificial background I would have appeared on top of whatever was on that web page before the player loaded. Typically text and picture content.

Regards - Jimb

Feb. 14, 2009Kevin

Thanks Jimb! Very thorough and all makes sense. You have helped me determine that a feature from the player is missing and should perhaps be looking into.

The issue is when you set a player to be scaled up to a browser window using "%"...the horizonal and vertical proportions do not scale uniformly...they scale up to the "%" of the browser window (which is independent of the actual video proportions) which creates the Dead Zones of color in the player window.

So now YAY!...here is the final question so we can knock this out of the park! :

"Is there a way to have the player window scale up and down and keep its proportions with repect to both the Browser Window AND the video it is playing?"

Since most screens and browser windows are set to a more letterbox proportion, perhaps the player window should adjust in realtime based on the VERTICAL "%" and then calculate the resulting horizonal dimension to there will be absolutely NO background color or deadzones within the player!

Kev
=)

P.s. You can see my website at www.GoNewsNOW.net and I would enjoy hearing what you think of it! Kev

Feb. 20, 2009Jimb

Kevin,

I THINK you'll find that the full screen mode is a feature controlled by the Adobe Flash plugin itself. It looks at you hardware and says, "what are my maximum diminsions" and fills that space. The player's stretching feature does interact with it but has no way to override how much space the Flash plugin will scale to. It will scale to whatever your monitor says it has.

JW has done a remarkable job of designing stretching into the player some flexibility (none, exactfit, uniform, or *fill*) with regard to how it scales within the display area of the player.

Just wondering if you have experimented with "fill" in conjunction with resizing? IF all of your videos are of common size I suspect you can get things to come close to what you're after in spite of the obsticals.

Regards - Jimb

Feb. 22, 2009Kevin

Thanks Jimb.

I have experimented with the Fill variable with no luck...what it does is fill in one direction or the other and leaves some area of the video hidden outside of the player window.

I guess I will haveto live with the subtle imperfections.
But overall I am beyond happy with the player and its results!

Kev
=)

Mar. 21, 2009resizing player

Hi,
I have a issue whereby my embedded YouTube Player fits
perfectly on my page, but when I resize my browser, the content of the page moves but the player sits in the same spot. Here's the link: http://www.jillbauerle.com/multimedia.html

Any suggestions? Do I need to insert something into the code? I'm using Dreamweaver.

Thanks,
Jill

Oct. 12, 2009Haris

sorry for hijacking your thread but I have not received a response on my thread :(

I am also trying to make the player background transparent so that the image behind the player is visible before the video is played.

I tried to use a transparent image in image flashvars but background color was still black. wmode is also transparent :(

Nov. 09, 2009ka81

Hello!
I'm using WordPress 2.8.5
also wordTube plugin - http://wordpress.org/extend/plugins/wordtube/
it has a JW player 4.3.

in http://x-files.net.ua/wp-admin/admin.php?page=wordtube-options#layout in Skin file i added /wp-content/plugins/wordtube/skin/bekle.swf

so now i use player with Bekle skin (http://www.longtailvideo.com/addons/skins/52/Bekle-(aka:-Overlay)?q=)

----------------

http://x-files.net.ua/?page_id=1315 - as you see it's already a little bit transparent around control buttons!!

the question is - how yo make all the other area transparent (it's black now - playlist, area around the video) ??

Help please exactly what to do?!

Thanx anyway!!!

Nov. 09, 2009ka81

/wp-admin/admin.php?page=wordtube-options#layout

here i can change the color of background but even if i leave color-fields blank - it's not transparent.. :(

Nov. 09, 2009ka81

/wp-admin/admin.php?page=wordtube-options#player

Custom variables

i added
screenalpha=0,transparent=true

for player it's worked!!!!

but for playlist - not.. :(

Nov. 10, 2009Ethan LongTail

Hi,

This feature is does not work with playlists, it was actually only available in 4.3 and removed in versions after because it was not completely working.

Please email me directly at ethan [at] longtailvideo [dot] com to follow up if you have any other questions, thank you.

Best Regards,
-Ethan

Add a reaction

You can also return to the category or try this search for related threads.

Your name *

Supported codes:

 

submit