I am currently writing a CMS and I need a few minor variable values from the YouTube Api. I wish to embed a YouTube video into a page and then extract key information about that video such as:
1. The Title
2. The duration
3. The number of hits
I have a video gallery with a bigger div with width 500 pixels where the main video is waiting to be played and below is a smaller div with all the others videos from the gallery having width of 80 pixels.The list of video are managed by a content management system in PHP and are the result of youtube "Share Embed action" where the result is an iframe with the link for the video.How can i clicking on a video from the smaller div see the video being displayed in the bigger div ? already playing? or in a new layer above the website ?For now the video plays in the div it is located at.As an example here is the source video format :
<iframe width="420" height="315" src="http://www.youtube.com/embed/somevideourlhere" frameborder="0" allowfullscreen></iframe>
I'm not using any framework so I'm not looking for any jquery shorthand. I just need to change the youtube video with a click.
Code:
<script type="text/javascript">
function changeVideo(vidSrc){
var link = vidSrc.href + "?version=3&hl=en_US&rel=0";
var movie = document.getElementById('embeddedMovie');
movie.setAttribute("src", link);
alert('SRC: ' + document.getElementById('embeddedMovie').src);
return false;
}
And the html:
Code:
<object width="560" height="315">
<param name="movie" id="embeddedParam" value="[URL]"></param>
<param name="allowFullScreen" value="true"></param>
<param name="allowscriptaccess" value="always"></param>
<embed id="embeddedMovie" src="[URL]" type="application/x-shockwave-flash" width="560" height="315" allowscriptaccess="always" allowfullscreen="true">
</embed></object>
The alert shows that the source is changing however the page just goes blank and the src is not updated in the markup. I also tried updating the parameter along with the movie but still no luck. Does the same on all browsers. If I use the same technique for images it works so I don't believe it to be any DOM loading issue.
I'm trying to create a video box on a website that plays a youtube video and then automatically plays random recommended videos with no break in playback. An endless playlist created by youtube based on the initial video. Youtube uses Javascript API. I have never used Javascript before but i'm just trying to get the video to play as above. There are few tutorials online and I couldn't find anyone trying to do a similar thing.
View 5 Replies View RelatedI am embedding several youtube videos on a page, by default, youtube videos do not autoplay.
To get them to autoplay, one simply appends &autoplay=1 to the youtube url.
E.g. http://www.youtube.com/v/6YR0LGK_HHA&autoplay=1
(will autoplay)
As opposed to:
http://www.youtube.com/v/6YR0LGK_HHA
(will not autoplay)
Does anyone know of a cool trick for being able to do this when the client clicks on a JS link labelled Play Video (without refreshing the page)? Code:
how to Dynamically embedding youtube video?
View 1 Replies View RelatedI have a YouTube channel with many videos. The links to these Flash videos are talking to a page within my web site. On the web site, the video pops up in a tiny window on entry of the page, and it closes when you click the close button or it will fade away after it has played its way through.
So the scenario is this: The site looks great, but it doesn't on an iPad. Because I am linking to a Flash YouTube URL, it doesn't load on the non-Flash iPad device. I have done a lot of online reading for a week and discussed on many forums. However, everywhere I turn, I read articles about how what I'm trying to do is not possible--that no YouTube URL will ever play on the iPad. Is this true? If so, why can they play on the iPad YouTube app? What is the difference between the app and my web page?
I found many articles and videos referencing this fallback: [URL]
However, my problem with this fallback is that my videos are on YouTube. I am using a URL to talk to it, more specifically an ID. The client has done this purposely to save bandwidth on their server. I have the start of the Javascript looking like this:
function loadPlayer() {
var params = { allowScriptAccess: "always" };
var atts = { id: "myytplayer" };
[Code].....
Within the loadPlayer function, can I add fallbacks in here (after line 4)? If so, how do I go about writing one? I suppose I'm just lost on how to get the HTML5 video option to work with my project. I have heard YouTube is using HTML5 video in beta, and it may be running in a few months. Would this auto-correct my problem do you think?
Is there a way to find the native file in the YouTube channel and bypass the .swf reference?
Ok well I am trying to insert a youtube video into an iframe with designMode on so I have been doing":
Code:
iframeDoc.execCommand("inserthtml", false, "<object width='480' height='385'><param name='movie' value='http://www.youtube.com/v/xlTyCymEM9g&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/xlTyCymEM9g&hl=en_US&fs=1&' type='application/x-shockwave-flash' allowscriptaccess='always' allowfullscreen='true' width='480' height='385'></embed></object>");
However, it will not show the player at all.
Its a long shot posting here but the task I'm using a jQuery Carousel that has a youTube video embedded on one of the slides:
[URL]
I have is does any one know a way that when the user clicks a new slide the youTube video pauses, turns off, or at the very least the volume of the video is set equal to zero.
I'm trying to find out the height of an embedded youtube-video (what I wan't to do is hide all embeds when I open a facebox and replace them with a placeholder of equal size). I (basically) tried this:
It always alerts 18, at least for the yourubevideos I embedded.
I'm having a strange issue with the positioning of a youtube videobar in the the right sidebar, but it only seems to be happening on Chrome and Safari. When one of the video thumbnails in the bar is clicked, it's supposed to open a player video beside it, but in Chrome and Safari the player video opens elsewhere on the page. It appears to work fine in Firefox and IE7 (only other browsers I've been able to test it in so far).
When I take the website's existing HTML and CSS out of the equation and just test the videobar by inserting it in a blank HTML page (an example) the player opens in the correct position, which is a dynamic position calculated within the javascript of Google's Search API. I haven't changed it from the defaults, just copied it locally to the site. The bulk of the changes to Google's defaults that I've made were by placing the #videoBar div that contains the videobar itself within a styled #vidBarholder div with a background image. Both of those divs are then placed within the sidebar left floated containing div.
Looks at each paragraph and converts youtube and yahoo video links to embedded players.Example
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
[code]....
I'm trying to create a Youtube video inserter script for my site. Long story short, I need to be able to prototype an HTML element and add a string into the element's innerHTML, like this:
myObj.insertVid(5sw2OvIgoO8);
I'm using jQuery to getElementsByClass("sip").
[Code]..
I'm using VS2008Pro with Master pages. On a child page, I have a modalPopupExtender that calls a panel with an embedded Google video. Everything works great - the popup appears with the video,background greyed.But, when I close the panel,the audio keeps playing in IE 7 & 8. Netscape is fine.I went and tried what Google recommended, but it still continues.
'//In child page header
<script src="../swfObject/swfobject.js" type="text/javascript"></script>
<script type="text/javascript"> [code].....
Take a look at this: [url] As you can see each img thumbnail has a title underneath. But I want the title to attach on the big player. It doesn't matter where exactly as long as I can access it with css.
(I have an additional question...When I put this code online the justin bieber video doesn't play. A message from Youtube is presented telling me that this is Vevo material and it can only be viewed on youtube. But as you can see it plays on jsfiddle.net.
We are having an issue with the video playing on our client's site. The video plays fully locally but not fully once set live on the any of the browsers, it plays just the first 15secs, then it stops.
Can anyone share some ideas as to how we can resolve this. The player is in Flash, and uses an eternal XML file for the video. We have checked and all connection are correct.
Header Code:
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>
Body Code
<script type="text/javascript">
var flashvars = {
[Code]....
I'm trying to adapt the following plugin:
youtubeplaylist
so that when you click on the thumbnails it also displays the video description underneath the video, a count, i.e. 1 of 3 etc. and previous and next buttons. Should I be using another plugin or is there a way with this one?
I am new to javascript (I started learning it today) so please explain it for newbies.I am trying to get the amount of video (in seconds) buffered already by the client and the whole duration of the video.Then, I divide them to get the precentage which was buffered so far.I have no problem storing the durating using:var duration = document.getElementById('vid').duration- returns "12.6" (seconds).I am struggling with getting the buffered time. I tried: var buffered = document.getElementById('vid').buffered.This one returns "[object TimeRanges]".From what I understood this is some kind of an object (Like an array?).I tried returning "buffered.length" and I get "1" back.
View 2 Replies View RelatedOn my website I have a video player at the top and below that a list of videos. Users click on one of the videos and that video begins playing in the player at the top of the page. Is there any way that the link the user clicks to play the video can also jump to the video player at the top of the page? I've tried various hyperlinks but I can't get it to work. The videos play fine, but the users don't realize that they need to scroll back up to the top of the page to see the video.
[URL]
#### below is the video player ####
<div id='videoPlayback' style='width: 425px; height:344px;'>
<!-- <div style='width: 425px; margin-left: auto; margin-right: auto; margin-top: 10px;'> -->
[Code]....
I'm looking to duplicate the video-embedding technique shown on revision5.com, whereby they show the flash video to all platforms where flash is available, and only show the HTML5 player on mobile devices. Is there a browser-sniffing framework, or some other method available to accomplish this?
View 3 Replies View RelatedI have created a transparent flash video (virtual spokesperson) for my website. For demoing purposes, I would like to have this appear on any desired website.
This is what I am trying to produce - here a virtual spokesperson appears on the [url]website: [url]
Have a look at other sites which enable one to type in a URL and their demo virtual spokesperson appears on the given site: [url] [url]
I believe they do this within an iframe to display the underlying website.
im working with execCommand and trying to make a function to insert a youtube video into a content editable div with execcommand inserthtml. Now this works with every other browser except, OMG IE. now i am trying to use pasteHTML(), found that some people have gotten it to work, for its part but for some reason it is not working
[Code]....
01) I would like to rollover (onmouseover?) a button that is a video and have the video (button) play. (A 5 sec video that stops at end)
02) On rolloff (onmouseoff?) the same button I would like it to rewind to the beginning for next rollover.
03) I would like to add more of these "Video Button Rollovers" to the same website page in the future. I would like to use DreamWeaver CS4, and stay away from flash for more accessibility and less memory intensive overhead. (obviously no control-bar for video)
I have all the parts to this to try a variety of solutions. The video is a box with untied string on a white background. When played a person fades-on and ties the string into a bow. (white background matches website background)
Parts:
01) video from untied box to tied box with person .mov
02) image of first frame of video .jpg
03) video from untied box to tied box with person to person fade-off and untied box .mov
04) video of tied box with person to person fade-off and untied box.mov
I'm trying to put multiple videos on one page. I tried to give each one an individual id but failed miserably. Also how on earth do I assign a image to each player. My example works with one player only and falls back to HTML5 video with no problems . If I decided on five videos per page, how do I apply an id to each one as well as a different image per player. Here is what I have so far code...
View 4 Replies View RelatedHere is what I am trying to do with no luck: I am sending an HTML marketing e-mail with a call to action to watch a video on my website. Since html e-mail code has to be pretty generic and simple I want to have the link inside the email be something like [URL].. Once the anchor is received on the web page the video automatically pops up and plays.
View 3 Replies View RelatedFrom my experience with HTML5 video so far (which isn't much), Firefox seems to switching to the "HAVE_ENOUGH_DATA" state too soon which is causing very choppy playback while the video is buffering. Is there a way to start the loading of video as soon as the page loads instead of waiting for the user to press play? I don't mean "autoplay", I want the video to start buffering as soon as the page loads without it playing.
View 2 Replies View Related