Пользовательские стили для нескольких экземпляров Fancybox

Я использую Fancybox 2.0.6 для отображения изображений и видео. При наведении на изображение / видео (когда в галерее несколько изображений), Fancybox отображает предыдущие и следующие значки и ссылки. Кликабельная область занимает 40% левой и правой стороны изображения / видео, как и должно быть в соответствии с jquery.fancybox.css. Это отлично подходит для изображений, однако для видео блокирует кнопку воспроизведения, так что пользователь может перейти к следующему / предыдущему видео, а не воспроизводить или приостанавливать видео. Я хотел бы изменить ширину интерактивной области, но только для видео - я бы хотел, чтобы она оставалась неизменной для изображений. Я исследовал Fancybox, чтобы выяснить, что я могу использовать wrapCSS для создания пользовательских стилей для нескольких экземпляров Fancybox, но не могу заставить его работать.

Вот мои звонки

<script type="text/javascript">
    $(document).ready(function() {
    $(".vimeo").fancybox({
    width: 781,
    height: 440,
    type: 'iframe',
    fitToView : false,
    wrapCSS    : 'fancybox-nav-video'
    });
    });
</script>
<script>
$(document).ready(function() 
{
$('.fancybox').fancybox(
    {
        padding : 0,
        openEffect  : 'elastic'
    }
    );
    $(".fancybox").fancybox(
    {
        wrapCSS    : 'fancybox-nav',
        closeClick : true,
        helpers : {
            overlay : {
                css : {
                    'background-color' : '#000'
                }
            },
            thumbs  : {
                width   : 50,
                height  : 50
            }
        }
    }
    );
}
);
$("a[href$='.jpg'],a[href$='.jpeg'],a[href$='.png'],a[href$='.gif']").attr('rel', 'gallery').fancybox();      
</script>

И вот как у меня есть изображения и видео, отображаемые в моем HTML:

<a class="fancybox" rel="gallery1" href="image1.jpg">
<a class="fancybox" rel="gallery1" href="image2.jpg">
<a class="vimeo" rel="gallery2" href="videoplayerlink1">
<a class="vimeo" rel="gallery2" href="videoplayerlink2">

Нужно ли что-то добавить или изменить в файле .js? Что мне не хватает?

Ответы на вопрос(1)

Ваш ответ на вопрос