Путевые точки jQuery не стреляют в правильном месте

Я пытаюсь установить три путевые точки со смещенными позициями, первая путевая точка работает абсолютно нормально и стреляет в правильном смещенном положении (75%), но вторая и третья путевые точки, расположенные сразу после карусели Flexslider, не стреляют по правильное положение смещения. Из-за того, что Карусель изменяет измерение высоты страницы, вторая и третья путевые точки запускаются, когда прокручивается намного дальше вниз по странице, после чего требуется, следовательно, увеличивается фактическое местоположение смещения.

Я пытался позвонить $.waypoints('refresh') но мне не повезло. Мой код выглядит следующим образом.

// first-flexslider
$(window).load(function() {
  $('#firstSlider').flexslider({
    animation: "slide",
    directionNav: false,
    controlNav: true,
  });
});
// second-flexslider
$(window).load(function() {
  $('#secondSlider').flexslider({
    animation: "slide",
    directionNav: false,
    controlNav: false,
  });
});
$('.prev, .next').on('click', function() {
  var href = $(this).attr('href');
  $('#secondSlider').flexslider(href)
  return false;
})
$(document).ready(function(){
  $.waypoints('refresh');
});
// waypoints
$(document).ready(function() {

  $('.wp1').waypoint(function() {
    $('.wp1').addClass('animated fadeInUp');
  }, {
    offset: '75%'
  });

  $('.wp2').waypoint(function() {
    $('.wp2').addClass('animated fadeInUp');
  }, {
    offset: '75%'
  });

  $('.wp3').waypoint(function() {
    $('.wp3').addClass('animated fadeInUpD');
  }, {
    offset: '75%'
  });

});

Я надеюсь выяснить, как преодолеть эту проблему и заставить 2-ю и 3-ю путевые точки стрелять в правильной позиции смещения (75%). Пожалуйста, дайте мне знать, если вам нужна дополнительная информация. Благодарю.

1 ответ

Решение

Flexslider имеет API обратного вызова, где вы можете выполнять функции после различных действий: https://github.com/woothemes/FlexSlider/wiki/FlexSlider-Properties

Я бы проверил after обратный вызов и, возможно, start обратный вызов и обновление вызова оттуда. Например:

$('#secondSlider').flexslider({
  animation: "slide",
  directionNav: false,
  controlNav: false,
  after: function() {
    $.waypoints('refresh');
  }
});
Другие вопросы по тегам