The drop-down menus I have are falling behind the youtube video no matter what I give the z-index to the menu. A website said using wmode=transparent but that didn't work because youtube discontinued supporting that tag. Any ideas?
YouTube doesn't "block" any tags - when you embed a YouTube video, you control the html that you use to embed it. You are free to add whatever extra params you like.
That said, using wmode=transparent is a bad idea, since it will decrease performance of the swf.
Using wmode=opaque will help a little, but is still not as good as not specifying the wmode (leaving it as the default, which is 'window').
If you do set it to 'opaque', then you should be able to place HTML elements over the video and it should work in most browsers, but may have issues on certain browsers in linux, or if the user has an older flash player version.
If you're embedding the player on your site you need to add a param tag that sets the wmode:
<object width="425" height="350">
<param name="movie" value="http://www.youtube.com/v/VIDEO_ID"></param>
<param name="wmode" value="opaque"></param>
<embed src="http://www.youtube.com/v/VIDEO_ID"
type="application/x-shockwave-flash" wmode="opaque"
width="425" height="350">
</embed>
</object>
This is an error with Flash. If you try to hide the flash video with any means it tends to overlap the existing content and pushes the video window forward.
Related
I'm building a website for a music composer. He'd like to publish samples of his work via Soundcloud and embed some of those samples on his website. He has a Premium account.
I'd like to make this as easy as possible for him (he ain't no geek). Basically, I'd like to let him just copy & paste the song's URL from the browser's address bar and make my application do the rest for him.
That's relatively easy to do actually - and I successfully made it work with the standard version of the player. But I can't find a working way of programmatically embeding the tiny version of the player. There's no mention of the tiny player in the Soundcloud oEmbed reference and just setting the maxheight param to 18 doesn't do it for me.
The problem is, I need to actually generate the embed on every page, because the same song embedded on the home page should be rendered using the tiny player, whereas on a subpage it should be the full standard player - therefore I can't just allow him to copy&paste the embed code from soundcloud to my app, because I'd then either have a tiny player embed code or a standard player code available, not both of them. Copy&pasting two different embed codes for the same song seems too much trouble for such a simple thing.
Another thing is I can't properly test this as I don't have a Premium account myself and I don't have access to his account.. would be cool if there was a way for developers to "mock" a Premium account for development purposes...
Thanks for any and all help!
Dan
Unfortunately, /oembed only works for regular widget (HTML5 of flash) at the moment.
However, you can build the html for either of them yourself. Here's a template for tiny widget embed:
<object height="18" width="100%">
<param name="movie" value="https://player.soundcloud.com/player.swf?url=http%3A%2F%2Fapi.soundcloud.com%2Ftracks%2F{trackId}&player_type=tiny{widgetParams}"></param>
<param name="allowscriptaccess" value="always"></param>
<param name="wmode" value="transparent"></param>
<embed wmode="transparent" allowscriptaccess="always" height="18" width="100%" src="https://player.soundcloud.com/player.swf?url=http%3A%2F%2Fapi.soundcloud.com%2Ftracks%2F{trackId}&player_type=tiny{widgetParams}"></embed>
</object>
And the template for regular widget:
<iframe width="100%" height="166" scrolling="no" frameborder="no" src="http://w.soundcloud.com/player/?url=http%3A%2F%2Fapi.soundcloud.com%2Ftracks%2F{trackId}{widgetParams}"></iframe>
You should put these into strings (without line breaks) and perform variable interpolation on these strings. I am not sure what language you are using, but most languages have this built in.
For JavaScript, which I'm writing most of the time, you could use Douglas Crockford’s supplant function.
The variables are trackId for which the value should be positive integer and widgetParams, for which the value should be something like &color=ff6600&auto_play=false, that is key=value pairs prefixed with &. I've used { and } as delimiters for variables to interpolate in my example, but it could, of course, be whatever your language or templates engine requires it to be.
For your client to be able to just give you a track URL, you'd need to do an API request to /resolve endpoint to retrieve track ID from track URL (permalink). You'd need to register as a developer to have client_id to authorise requests to the API. I've described how to do it in JavaScript in another answer here.
If you'd prefere not to do requests to the API, you could also ask your client to give you the embed code they can easily retrieve from any sound or set on SoundCloud by hitting "share" button, and then extract the sound or set ID using regular expression.
Here's an example of how this would work to insert a tiny widget (also using SoundCloud JS SDK) http://jsbin.com/OLUloX/1/edit
I will be writing an application that uses the youtube API for videos. I want to integrate it with canvas. Is there anyway to make sure I get HTML5 compatible videos through the API calls?
In case you mean using <video />: the only way to embed YouTube-videos is <object /> or <iframe />. So, embedding via <video /> is not possible at this point and will most likely never be.
In case you mean validity: Both available options are valid in HTML5.
With the IFrame API, YouTube may use HTML video instead of Flash, but this can't be set manually. See this.
Im building a site which opens Youtube videos onsite using Shadowbox.
I have found out that linking to a video this way ...
http://www.youtube.com/watch?v=wDZFf0pm0SE
..doesn't work (Shadowbox opens, video doesnt play). But linking this way...
http://www.youtube.com/v/wDZFf0pm0SE
.. does.
Can someone explain to me what is going on here?
The /v/ link is a direct link to the video, which is used for embedding it. You use it like this:
<embed src="http://www.youtube.com/v/wDZFf0pm0SE&autoplay=1" type="application/x-shockwave-flash" wmode="transparent" width="800" height="600"></embed>
However, due to licensing restrictions some videos will fail to play in the /v/ format.
The &autoplay=1 part just tells it to start the video on page-load. (Remove it to not do that).
The normal link is used to watch the video from Youtube itself.
Hope this helps.
hi hello i'm new in this forum and new in youtube
i also created a sample
let me tell the steps
copied a sample youtube html script from http://groboclown.net/yt_playlist/howto-embed-long.html
and on clicking the sampl.html it just show the youtube player black color that all
what is the problem i put an alert in the onYouTubePlayerReady() {
but its not printing any thing WHY? how can i do the youtube embeddig please help me any body how can i do it
is a webserver as (tomcat or jboss etc)is always needed for it then how can do this please help me any body can
The simplest way to embed a youtube on a webpage is to use the embed code provided on the youtube page the video is on. It normally looks like this:
<object width="640" height="385"><param name="movie" value="http://www.youtube.com
/v/ZZZZZZZZZZZ&hl=en_US&fs=1"></param><param name="allowFullScreen" value="true">
</param><param name="allowscriptaccess" value="always"></param><embed
src="http://www.youtube.com/v/ZZZZZZZZZZZ&hl=en_US&fs=1" type="application/x-
shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="640" height="385">
</embed></object>
Where ZZZZZZZZZZZ is the video id.
The script you are using is for creating youtube playlists. It is possible they are not playing because either embedding is disabled for the video you are trying to play, or the actual URL is invalid. Youtube video IDs have a specific length, and most frequently, people mistake the ID field as the whole URI. It is not, and a Gdata resource of http://www.yout makes a very poor youtubeID.
I would suggest getting the firebug plugin for firefox to check for errors and monitor the javascript calls to make sure they are actually being called when clicked.
If you are using the youtube API, check your server log to see if the incorrect Gdata resource is being cUrled, otherwise this will = FAIL.
Normally, youtube videos are in an .flv file format, so re-embedding the video in a separate flash player might cause it to not work properly if the direct URL to that file is not accessible. Normally the raw .FLV is never accessable because this in turn is separate sub-FLV embedded within the youtube player flash object.
I have a 100% silverlight application that takes up the entire screen.
Plan A: I would like to embed other silverlight ads but I cannot find any companies that provide this service.
Plan B: Embed classic HTML ads into the app. I've found one way by playing around the with DIV's and Javascript but it seems like a major hack. do not want.
Anyone managed to display ads with silverlight?
the possible solution may be "you can use web service which feed ad-data to SL application, and then display it."
All silverlight application are embeded in html using object, for example:
<object data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="100%" height="100%">
It means you still can have other html element in the page where you have silverlight. You even can create new html elements and add that to the page in your code behind.
So one solution is to create a div element in the page that is hosting silverlight and show it in front of silverlight object using z-index. And there are atleast two ways to implement this solution:
In code behind. Way to access html element in code behind file:
HtmlElement mydiv = HtmlPage.Document.GetElementByID("mydiv");
Using javascript
It is a workaround, but we have to stick with it until silverlight can embed html inside it.