0

一切正常,无需在视频和图片之间导航箭头,我在我的网站的 java 中有这个:

<script type="text/javascript">
$(document).ready(function(){
    $(".fancyYoutube").click(function() {
    $.fancybox({
    'padding'       : 0,
    'autoScale'     : false,
    'overlayShow'   :   false,
    'transitionIn'      : 'elastic',
    'transitionOut'     : 'elastic',
    'showNavArrows'     : true,
    'title'     : this.title,
    'width'     : 680,
    'height'        : 495,
    'href'      : this.href.replace(new RegExp("watch\\?v=","i"), 'v/'),
    'type'      : 'swf',
    'swf' : {
    'wmode' : 'transparent',
    'allowfullscreen' : 'true'
    }
    });
    return false;
    });
});

这是我的 html 代码(混合视频/图片部分):

<a class="fancyYoutube" title="KravMAGA" href="../img/auto.jpg" rel="grupa"><img src="http://i4.ytimg.com/vi/ci-pBX9lQKQ/default.jpg"></a>
        <a class="fancyYoutube" title="KRAVMAGA" href="http://www.youtube.com/watch?v=zcUUVHhlAjE&feature=plcp&autoplay=1" rel="grupa"><img src="http://i3.ytimg.com/vi/zcUUVHhlAjE/default.jpg"></a>
        <a class="fancyYoutube" title="KravMAGA" href="http://www.youtube.com/watch?v=zcUUVHhlAjE&feature=plcp&autoplay=1" rel="grupa"><img src="http://i3.ytimg.com/vi/bJCp9PW_KaA/default.jpg"></a>
        <a class="fancyYoutube" title="KRAVMAGA" href="http://www.youtube.com/watch?v=ci-pBX9lQKQ&autoplay=1" rel="grupa"><img src="http://i4.ytimg.com/vi/ci-pBX9lQKQ/default.jpg"></a>
        <a class="fancyYoutube" title="KravMAGA" href="../img/auto.jpg"><img src="http://i3.ytimg.com/vi/bJCp9PW_KaA/default.jpg"rel="grupa"></a>

而且我没有任何导航箭头,为什么?在css中一切都很好,每个图像(精灵)都与fancybox.css在同一个文件夹中我做错了什么?

#fancybox-left {
    left: -50px;
}

#fancybox-right {
right: -50px;
}

请帮忙

4

2 回答 2

1

问题是您正在使用.click()带有 fancybox v1.3.4 的手动方法。除非您在脚本中设置它,否则没有办法拥有这样的画廊

$(".fancyYoutube").click(function(){
 $.fancybox([
  {"href": "TARGET HERE"},
  {"href": "TARGET HERE"} // more as you need them
 ],{
  // fancybox options here
 });
});

此外,您正在尝试使用相同的脚本设置不同类型的对象(图像和视频)的画廊,这也是不可能的。

Fancybox v2.x已经克服了这些问题,您可以使用助手轻松设置图库fancybox-media,但想知道是否正在考虑升级。

就像保留当前的 ​​html 并加载fancybox.jsfancybox-media.js文件一样简单。

那么脚本就很简单了

$(".fancyYoutube").fancybox({
 helpers : { 
  media : {} 
 }
});
于 2012-06-16T16:50:26.417 回答
0

对于像这样的版本 2 - http://jsfiddle.net/nn4Tg/

您可能想要使用媒体助手来使直接链接起作用。

于 2012-06-18T07:43:24.790 回答