javascript - 带 Owl Carousel 的全屏 slider

Question

我有一个很大的请求需要帮助某事。我需要将 Owl Carousel slider (全屏)的高度设置为 html 和正文的 100%。但我还需要在它上面放一点地方。

这是我对其他 slider 所做的以及我需要的:http://lukaszradwan.com/

还有 Owl Carousel 的例子http://lukaszradwan.com/pl/

请垂直调整您的浏览器大小以查看效果。

谢谢!

编辑//

快完成了，但我还有一个问题。 slider 下面有一个空的地方，我不知道为什么 lukaszradwan.com/pl

我需要与 cd-main-content 类具有相同的高度作为视口(viewport)。你能看看吗？

$(document).ready(function() {

  // carousel setup
  $(".owl-carousel").owlCarousel({
    navigation : true,
    slideSpeed : 300,
    pagination : true,
    paginationSpeed : 400,
    singleItem: true,
    autoHeight: true,
    afterMove: top_align,
    navigationText : false,
    afterAction: function(current) {
    current.find('video').get(0).play();
}
  });

  function top_align() {
    $(window).scrollTop(0);
    console.log('move');
  }

});
$(window).scroll(function(){
  if ($(this).scrollTop() > 50) {
      $('.owl-pagination').addClass('hidden');
  } else {
      $('.owl-pagination').removeClass('hidden');
  }
});

Answer 1

我刚刚添加了

position: absolute;
top: 289px;
bottom: 0;
left: 0;
right: 0;

到视口(viewport)和 margin-bottom: 289px; 到 cd-main-content 一切正常。