如何在全屏滑块上添加箭头

Question

我最近为一位摄影朋友完成了一个网站，他回复我说他的项目页面上的滑块很难使用，他想要箭头，每当我尝试在其中添加箭头时，我都找到了导航将箭头推到视野之外，我想知道是否有人知道解决此问题的方法。

请参阅下面的页面链接。提前谢谢你。

Daniels Website

Answer 1

您链接的网站使用 Swiper，这是一个滑块框架。根据Getting Started，您需要添加两个箭头，您的朋友似乎已将其注释掉。由于您的站点有 jQuery，因此您还需要在 document.ready 事件中对其进行初始化。尝试将代码放入事件中，如下所示：

  $(document).ready(function () {
    //initialize swiper when document ready  
    var swiper = new Swiper('.swiper-container', {
        pagination: '.swiper-pagination',
        nextButton: '.swiper-button-next',
        prevButton: '.swiper-button-prev',
        paginationClickable: true,
        spaceBetween: 0,
        loop: true,
        centeredSlides: true,
        autoplay: 7000,
        autoplayDisableOnInteraction: false,
        slidesPerView: 1,
        effect: 'fade'
    })
  });