FancyBox навигация по определенным ссылкам

Question

Привет, хорошие люди из StackOverfow, мне нужна помощь с отображением стрелок навигации FancyBox.Мне нужно, чтобы они были всегда видимыми (не только при наведении) на группах изображений, но невидимыми на видео, которые открываются в окне FancyBox.

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

$("a[rel=images]").fancybox({
    'transitionIn'  : 'none',
    'transitionOut' : 'none',
    'showNavArrows' : 'true',   
    'titlePosition' : 'over',
    'titleFormat'   : function(title, currentArray, currentIndex, currentOpts) {
                          return '<span id="fancybox-title-over">Image <strong>' 
                               + (currentIndex + 1) 
                               + ' </strong>/ ' 
                               + currentArray.length 
                               + (title.length ? ' &nbsp; ' + title : '') 
                               + '</span>';
                       }
});

, и я добавил две строки CSS, чтобы стрелки всегда были видны на изображениях:

#fancybox-left-ico {left: 20px;} 
#fancybox-right-ico {right: 20px;} 

Код для открытия видео в окне FancyBox::

$(".video").click(function() {
    $.fancybox({
        'padding'       : 0,
        'autoScale'     : false,
        'transitionIn'  : 'none',
        'transitionOut' : 'none',
        'title'         : this.title,
        'width'         : 700,
        'height'        : 450,
        'href'          : this.href.replace(new RegExp("watch\\?v=", "i"), 'v/'),
        'type'          : 'swf',
        'swf'           : {
            'wmode'             : 'transparent',
            'showNavArrows' : 'false',
            'allowfullscreen'   : 'true'
        }
    });
    //$('.fancy-ico').hide();
    return false;
});

Когда я нажимаю ссылку на видео, в окне fancybox отображаются обе навигационные стрелки, что понятно, потому что для этого есть две мои добавленные строки CSS.Когда я добавляю строку кода, которая выглядит примерно так:

$('.fancy-ico').hide();

, окно видео открывается без стрелок, что все еще хорошо.Проблема в том, что, когда я снова нажимаю на изображения, стрелки не отображаются, потому что я скрыл стрелки с последней строкой jquery.

Теперь мой вопрос: как я могу заставить эту работу работать?Где я могу вставить фрагмент кода, который выглядит следующим образом:

$('.fancy-ico').show();

Есть ли какой-нибудь более умный способ сделать что-то подобное?

Спасибо всем за любую помощь

Answer 1

Вы можете использовать для кодирования своих изображений функцию onStart: чтобы каждый раз при загрузке изображений fancybox отображались и стрелки.

$("a[rel=images]").fancybox({
                'transitionIn'      : 'none',
                'transitionOut'     : 'none',
                'showNavArrows'     : 'true',   
                'titlePosition'     : 'over',
                'titleFormat'       : function(title, currentArray, currentIndex, currentOpts) {
                    return '<span id="fancybox-title-over">Image <strong>' + (currentIndex + 1) + ' </strong>/ ' + currentArray.length + (title.length ? ' &nbsp; ' + title : '') + '</span>';
                }
                // onStart: "Will be called right before attempting to load the content"
                'onStart'           : function() {$('.fancy-ico').show();}

            });