2015-10-21 7 views
0

Попытка переместить субтитры на FlexSlider, подумал я мог сделать: var myP = $('p.flex-caption').detach().appendTo(x); где х будет любой элемент, который я хотел подписи появляться после. На практике это работает ok - Я получаю дамп всех титров, а не только тот, который связан с активным слайдом, но это может быть всего лишь вещь css. Большая проблема заключается в том, что это происходит не до второго слайда , Я вызываю это внутри flexslider.js (вставлено ниже) внутри $ (селектора) .flexslider и внутри 'before' - я предполагаю, что проблема имеет какое-то отношение к тому, как вещи загружаются. В альтернативном подходе вместо использования detach() просто выщипывать p и повторно устанавливать его, я попытался создать элемент captionDiv, внутри которого еще один созданный элемент - caption - будет заполнен html, возвращенным из ползунка запроса .slides [slider.animatingTo], но, опять же, первый заголовок не появится.

$(selector).flexslider({ 
     smoothHeight: options.h_responsive, 
      animation: options.animation, 
      direction: options.direction, 
      slideshow: options.slideshow, 
      slideshowSpeed: Number(options.cycle_speed) * 1000, 
      animationSpeed: Number(options.animation_speed) * 1000, 
      pauseOnHover: options.pause_on_hover, 
      controlNav: options.control_nav, 
      directionNav: options.direction_nav, 
      keyboard: options.keyboard_nav, 
      touch: options.touch_nav, 
      before: function(slider) { 
       slider.removeClass('loading'); 
       //added for outside caption 
       //var sgmCaption = $('p.flex-caption'); 
       var tnh = $('div.flex-thumbnail-holder'); 
       //sgmCaption.detach().appendTo(tnh); 
       if (!slider.captionDiv) { 
        slider.captionDiv = document.createElement("div"); 
        slider.captionDiv.setAttribute("class", $(slider)[0].getAttribute("id") + "-caption flex-outside-caption"); 
        //$(slider.captionDiv).insertAfter($(slider)); 
        $(slider.captionDiv).insertAfter($(tnh)); 
       } 

       var caption = slider.slides[slider.animatingTo].querySelector('.flex-caption'); 
       slider.captionDiv.innerHTML = caption ? caption.innerHTML : ""; 

      } 

      }); 

Благодарим за помощь.

ответ

0

За документации:

$(selector).flexslider({ 
    // Callback: function(slider) - Fires when the slider loads the first slide 
    start: function(){}, 
    // Callback: function(slider) - Fires asynchronously with each slider animation 
    before: function(){} 
}); 

before обратного вызова срабатывает только тогда, когда анимация между слайдами начинается. Вам нужно подготовить заголовок первого слайда самостоятельно - после подключения или в обратном вызове start.

+0

Блестящий! Благодаря! Я продублировал код и поместил его в start(), а также как и раньше(); Я не уверен, что вызвано первым - начать или раньше, и в чем я должен инициализировать vars? – user1574371

+0

'start' определенно называется первым, потому что он вызывается во время настройки (загрузка страницы?) И' before' вызывается после пользовательских слайдов. –