Does anyone know about a technique to make links on a website function as deep links to an embedded vimeo/youtube video on that same page?

That way one could include video's in a blog post or similar, and reference certain portions of the video through deep linked time codes. I suspect one would need some javascript magic to do this.

On another note, I wish I had the "tagging might" to be able to introduce the tags deep-linking and vimeo.

2 Answers 2


You can embed deep-linked YouTube videos by using the 'start' attribute to make playback start at a specific time, like this:

<iframe id="video" width="560" height="349" src="http://www.youtube.com/embed/3CR5y8qZf0Y?start=20" frameborder="0" allowfullscreen></iframe>

You could modify the start time using JavaScript and jQuery, like this:


function setTheTime(theTime) {
    var videoURL = $('iframe#video').attr('src');
    videoURL = videoURL.replace(/=.+/, "="+theTime+"&autoplay=1");

$('.time').click(function() {
    var newTime = $(this).attr('href').replace('#','');


<p>Watch this video from <a href="#20" class="time">20 seconds</a> or from <a href="#40" class="time">40 seconds.</a></p><br/><br/>

<iframe id="video" width="560" height="349" src="http://www.youtube.com/embed/3CR5y8qZf0Y?start=0" frameborder="0" allowfullscreen>    </iframe>

Here's a working demo of the result. (Click the '20 seconds' and '40 seconds' links in the 'Result' frame on the bottom right to see it working.)

Note that I modified the default YouTube embed code to add ?start=0 to the src and the id="video" attribute so we can target that iframe with jQuery.

Once you've done that, all links on the page using the <a href="#20" class="time">link text here</a> format will modify the start time and autoplay the video.

Not sure if this is possible with Vimeo, as I'm not as familiar with their embed code.

  • Excellent! I'm a JS newbie, but let's see if I get it: First you make a function, that grabs the url of the youtube video. Through some regex it adds the "time" from the function call and trows on an autoplay. Last line in the function, replaces the iframe's url. Seems interesting to me that the Youtube video responds so well to having it's src replaced. Thank you for taking the time to answer this.
    – thunki
    May 3, 2011 at 11:14
  • Btw, you used var newTime = $(this).attr('href').replace('#',''); Why did you use .replace, and made href be #20 instead of just 20?
    – thunki
    May 3, 2011 at 11:20
  • You've got it! The $('.time').click() part finds all HTML tags with a class of 'time', and attaches a click behaviour which says 'strip the # from the href and pass that number to setTheTime(). The setTheTime() function then grabs the existing YouTube URL from the iframe that holds our video, replaces the 'time=0' with the number in the href of the link we clicked, and turns autoplay on. Then it updates the iframe's src, which forces the iframe to reload by requesting the video again from YouTube with the new time info. JavaScript is pretty handy.
    – Nick
    May 3, 2011 at 11:32
  • The href="#20" instead of the href="20" is in case the visitor has JavaScript turned off. If someone without JavaScript visits yoursite.com/index.html and clicks a link like this <a href="30">my link</a>, the browser will try to send them to yoursite.com/30/ But if they click a link like this <a href=#30">my link</a>, the resulting url will be yoursite.com/index.html#30, which won't redirect them. It's still not ideal, but it's a worthwhile addition to prevent people with JS turned off (and search robots) from following the links to error pages.
    – Nick
    May 3, 2011 at 11:43

For YouTube, this is how you link using timecodes to get to the bit you want: http://www.google.com/support/youtube/bin/answer.py?answer=116618

For Vimeo this FAQ describes how to do it, but only if it's your video: http://vimeo.com/help/faq#chapters

  • Thanks for the answer, but I was wondering how to make use of time codes on a personal webpage. However I got an answer now. :)
    – thunki
    May 3, 2011 at 11:21
  • It would be good if you answered your question here in case other people have the same problem. May 3, 2011 at 13:55

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.