transparent background
I was wondering if there is any way I can make the default color of the background transparent?
46 Community Answers
JW Player
User
0
rated :
Try putting the param:
wmode=transparent in the flash player object.
JW Player
User
0
rated :
@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
JW Player
User
0
rated :
Jimb your video wouldn't work but I'd love to see it to know how to modify the FLA for a transparent background.
JW Player
User
0
rated :
@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
JW Player
User
0
rated :
@Jimb
can you post the code for the latest 4.3 version?
regards,
mustafa
JW Player
User
0
rated :
@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
JW Player
User
0
rated :
Okey, I am new at this. Where do I add the code?
Current code:
bc.. <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.
JW Player
User
0
rated :
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
JW Player
User
0
rated :
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
JW Player
User
0
rated :
@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!
JW Player
User
0
rated :
@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*
JW Player
User
0
rated :
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
=)
JW Player
User
0
rated :
@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
JW Player
User
0
rated :
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
=)
JW Player
User
0
rated :
@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
JW Player
User
0
rated :
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
=)
JW Player
User
0
rated :
@ 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
JW Player
User
0
rated :
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
=)
JW Player
User
0
rated :
...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
=)
JW Player
User
0
rated :
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.
JW Player
User
0
rated :
@Randall
If you go to my website bc.. *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. bc.. h*ttp://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
JW Player
User
0
rated :
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.
JW Player
User
0
rated :
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
=)
JW Player
User
0
rated :
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. bc.. *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. bc.. *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
JW Player
User
0
rated :
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
JW Player
User
0
rated :
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
JW Player
User
0
rated :
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
=)
JW Player
User
0
rated :
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
JW Player
User
0
rated :
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 :(
JW Player
User
0
rated :
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!!!
Ethan Feldman
JW Player Support Agent
0
rated :
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
JW Player
User
0
rated :
Some final clarity for those wishing to make the player background transparent
this is unavailable in 5.0 but can be achieved if you recompile the player (all else about emded requirements remain true such as wmode etc)
alter View.as
change background.graphics.beginFill from alpha 1 to 0 (see below, last value in beginFill brackets)
protected function setupBackground():void {
var background:MovieClip = new MovieClip();
background.name = "background";
_backgroundLayer.addChild(background);
background.graphics.beginFill(_player.config.screencolor ? _player.config.screencolor.color : 0xFFFFFF, 0);
background.graphics.drawRect(0, 0, 1, 1);
background.graphics.endFill();
}
Ethan Feldman
JW Player Support Agent
0
rated :
Thanks ! :)
JW Player
User
0
rated :
It should at least be possible to change the background colour of the Playlist? We can't even match this to the colour of the screen (the colour of which we can change via vars/XML).
When skinning via XML, not being able to change the Playlist background is very limiting (always boring default black).
You need to get some visual designers on board when you're scripting.
Pablo
JW Player Support Agent
0
rated :
@FlashSkins -
The playlist component does already have a “background” element that you can set in your skin XML, which will be stretched behind the playlist items.
JW Player
User
0
rated :
/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.. :(
JW Player
User
0
rated :
/wp-admin/admin.php?page=wordtube-options#player
Custom variables
i added
bc.. screenalpha=0,transparent=true
for player it's worked!!!!
but for playlist - not.. :(
JW Player
User
0
rated :
i have set size 1280x720 in 16:9 aspect ratio and JW player size was 640x360 it is also under in 16:9 aspect ratio....but i have black background in left and right side now ....so what can i do.....in how can i set stretching uniform setting permanently.
Ethan Feldman
JW Player Support Agent
0
rated :
@yeshdev – Set the stretching flashvar to exactfit. It will remove the bars.
JW Player
User
0
rated :
If you have a transparent background is their a code to make your picture not be transparent and light up when you scroll to the
Ethan Feldman
JW Player Support Agent
0
rated :
@girlskater562 – …Scroll the what?
JW Player
User
0
rated :
Hi guys:
Can the transparent background also be made to work in the latest version 5?
It would be cool to be able to display all of the player's icons straight
over the webpage without the player's background.
Thanks,
Jeremy
JW Player
User
0
rated :
I believe you can only get true transparency with the control bar set to 'over'. But then in this mode you'll have problems with the time (text fields) for elapsed and duration. They need a background colour if they're to be seen over your video clip.
If you have the control bar set to 'bottom' or 'top' then you can match the background to your webpage via XML, but you could also just do this as part of your Skin design too (match the PNGs).
Pretty sure JWP v5 doesn't work with Flash wmode set to transparent, so opaque and translucent yes, total transparency, not really?
JW Player
User
0
rated :
I was able to make a completely transparent background for the player. It looks great and it's very simple to do. See my post in this forum...
*Make JW Player version 5.3 Display a Completely Transparent Background*
JW Player
User
0
rated :
Using 'wmode=tranparent' has always been avoided by many doing Flash development. Firstly it puts an extra load on whoever's computer the player is running on, and the rendering is not always reliable across Browsers. It depends in part on your HTML/CSS code, but I've come across problems before, so I just tend to steer clear of it.
You can't use transparency on a generic skin either (which is what I do) because the player may be set to 'controlbar=over'.
JW Player
User
0
rated :
Some final clarity for those wishing to make the player background transparent
this is unavailable in 5.0 but can be achieved if you recompile the player (all else about emded requirements remain true such as wmode etc)
how do i access this file; i want a transparent player....
it should somehow be an easier option, can it be included in an upgrade?
after all, i see many people want use the jw player, without compromising site design.
keith,
alter View.as
change background.graphics.beginFill from alpha 1 to 0 (see below, last value in beginFill brackets)
protected function setupBackground():void {
var background:MovieClip = new MovieClip();
background.name = "background";
_backgroundLayer.addChild(background);
background.graphics.beginFill(_player.config.screencolor ? _player.config.screencolor.color : 0xFFFFFF, 0);
background.graphics.drawRect(0, 0, 1, 1);
background.graphics.endFill();
}
thanks,
k reddog
This question has received the maximum number of answers.