Colorbox Deeplink

时间:2013-12-18 09:46:55

标签: javascript jquery html colorbox

我正在使用colorbox在一个页面上显示视频。问题是我需要共享一个直接用特定视频打开彩盒的网址。

我到处搜索,但我不知道从哪里开始。我是否需要在url的末尾传递一个哈希值,它会告诉colorbox需要打开的视频?如何点击/观看特定视频时如何生成/更新网址?

谢谢!

下面的html是在foreach循环中。因此,同一个类将有多个这样的数字。

<figure>
  <a class="youtube" href="http://www.youtube.com/embed/VOJyrQa_WR4?rel=0&amp;wmode=transparent">
      <img src="http://img.youtube.com/vi/VOJyrQa_WR4/mqdefault.jpg">
     <span class="play"></span>
   </a>
    <figcaption>
       <p>asdasd</p>
    </figcaption>
</figure>

和JS

$(".youtube").colorbox({iframe:true, innerWidth:853, innerHeight:670});

1 个答案:

答案 0 :(得分:0)

没关系,我已经找到了解决方案。对于那些不知道从哪里开始的人,这里是代码:

HTML

<a id="YOUR-VID-ID" class="YOUR-COLORBOX-CLASS" href="http://example-page-to-frame">

JS

 var colorboxId = 
     (window.location.href.indexOf('video=')==-1) ?
 false :
     window.location.href.slice(window.location.href.indexOf('video=') + 'video='.length + 1).split('&')[0];

$(".YOUR-COLORBOX-CLASS").colorbox({iframe:true, innerWidth:853, innerHeight:670});

if(colorboxId!==false) {
    $('#' + colorboxId).colorbox({open:true});
}

您获取视频的网址

http://example.com?video=#id