Go
Not registered? Sign up!

mask for preview image (rounded corners)

Google Translate
12 posts | return to the Skins forum | get the rss feed for this thread

Nov. 23, 2008paranoiaparadise

Hello*,

I have a player with rounded corners and it looks great.
When I use a preview image, it does not have rounded corners. In which layer is the preview image loaded? If I knew it, I could change the player by adding a mask for this layer. Then the preview image would have rounded corners too.

Thanks for replies.

Nov. 27, 2008paranoiaparadise

too bad - no replies...

Dec. 02, 2008MumbayOrNot

I'd be interested in a solution too ;-)

Dec. 02, 2008andersen

if you dont need rounded corners in fullscreen mode - you can just use a simple css overlay, and avoid recompiling the player

please see the - http://www.jeroenwijering.com/?item=Javascript_API_Examples
and the "masking" example - http://home5.inet.tele.dk/nyboe/flash/mediaplayer4/JW_API_xmpl_7-1-1-0.html

please note that the above examples all use the swfobject v.2.1 - http://code.google.com/p/swfobject/

Dec. 23, 2008Stephen

Problem is, this doesn't do 9 slice scaling, and in the case of IE6, you can't use a transparent overlay with nicely antialiased text. Not to mention it's a complicated solution.

It would be great to have the display mask apply to the preview image as well.

Dec. 23, 2008andersen

@Stephen - to resize the css overlay you just resize the image, or with an absolute px size in the image tag or set to 100% and and then size the containg div - the css overlay mask will also mask the preview image...

and rest assured it is definetely less complicated than modifying/recompiling the player!

im not sure i understand what you mean by "nicely antialiased text" - if you want text on the image you ofcourse have to antialiase the text when you make the image - maybe use a .gif rather than .png image -
i have a vague memory that some of the obsolete browsers didnt like .png -

Dec. 31, 2008JeroenW

Hmm, I'm afraid it's not possible to do rounded corners on playlist images, since the mask on top of them is drawn by actionscript. The only workaround would be to actually place the corners in the color of the playlistbackground on top of the image.

In the meantime I'll take a look if this can be fixed.

Jan. 02, 2009Stephen

@andersen: Sorry I meant anti-aliased corners, not text. Because IE6 can't do alpha transparency with PNGs, you can't use them for nicely anti-aliased curves when using masks.

Jan. 30, 2009brett

ie6 png fix:
http://www.twinhelix.com/css/iepngfix/

that should solve your problem

Feb. 26, 2009Rui

@JeroenW is it possible to achieve this with the logo?

Jun. 19, 2009JB

"and the "masking" example - http://home5.inet.tele.dk/nyboe/flash/mediaplayer4/JW_API_xmpl_7-1-1-0.html"

This seems to only work in IE - get the placeholder get flash message in ff, chrome, etc. Any ideas?

Oct. 16, 2009Kookie

I'm desperately trying to find examples of the player using images as masks, ie showing through a cutout like I think was shown here: http://home5.inet.tele.dk/nyboe/flash/mediaplayer4/JW_API_xmpl_7-1-1-0.html
This example doesn't seem to be available as TDC has closed this service.
Has it been relocated, any similar examples I can look at please?

Add a reaction

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


 

Search the Forums

Go

Support

Support Here are some helpful links to learn more about the JW Player™:

Monetize Your Video

Monetize Your Video Earn money with ads from LongTail's AdSolution. Watch our demos and sign up now!

Why Buy a License?

Why Buy a License? If you don’t buy a commercial license, you cannot use a JW Player™ on (i) a site that has ads; (ii) a corporate site; or a (iii) CMS. Our licenses are very inexpensive, so what are you waiting for? Buy a license today.