Как сделать карусель совы со стрелками вместо следующей предыдущей

вчера я выставил сайт клиенту. Я всегда использую Карусель Совы, так как она отзывчива. Клиент всегда ненавидел предыдущие, следующие слова и хотел изменить их на стрелки.

Итак, я обновил свой script. js файл. Это было очень легко сделать, и я хотел поделиться им.

$(document).ready(function(){
$('.owl-carousel').owlCarousel({
    nav:true,
    responsive:{
     ...
 })
 $( ".owl-prev").html('<i class="fa fa-chevron-left"></i>');
 $( ".owl-next").html('<i class="fa fa-chevron-right"></i>');
});

Там, у тебя есть. Вы всегда можете добавить больше стилей. (В первый раз я использую ответ на свой вопрос, надеюсь, что это подходящее место/путь)

Ответы

Ответ 1

Так вы делаете это в своей функции $(document).ready() с помощью значков FontAwesome:

 $( ".owl-prev").html('<i class="fa fa-chevron-left"></i>');
 $( ".owl-next").html('<i class="fa fa-chevron-right"></i>');

Ответ 2

Если вы используете Owl Carousel 2, вы должны использовать следующее:

$(".category-wrapper").owlCarousel({
     items : 4,
     loop  : true,
     margin : 30,
     nav    : true,
     smartSpeed :900,
     navText : ["<i class='fa fa-chevron-left'></i>","<i class='fa fa-chevron-right'></i>"]
   });

Ответ 3

Примечание для других, которые могут использовать Owl Carousel v 1.3.2:

Вы можете заменить текст навигации в настройках, в которых вы включили навигацию.

navigation:true,
navigationText: [
   "<i class='fa fa-chevron-left'></i>",
   "<i class='fa fa-chevron-right'></i>"
]