Owl Carousel работает, но действует крайне странно в Rails 4 приложении

Я пытаюсь реализовать Сову Карусель. Все файлы работают правильно, но в их поведении есть что-то крайне неправильное.

Вот как это выглядит:

Каждое изображение имеет свой собственный div, но карусель Owl показывает его так, как если бы это было только одно изображение.

Вот код для этого:

.post_image_description
            .owl-carousel#owl-example
                - @post_attachments.each do |p|
                    = image_tag p.image_url

Мои posts.js.coffee:

$ ->
    $("#owl-example").owlCarousel({

      navigation : true,
      slideSpeed : 300,
      paginationSpeed : 400,
      singleItem:true,
      items: 1
  });

Что касается связывания скриптов, я использую CDN для этого:

%script{:src => "https://cdnjs.cloudflare.com/ajax/libs/owl-carousel/1.3.3/owl.carousel.css"}
    %script{:src => "https://cdnjs.cloudflare.com/ajax/libs/owl-carousel/1.3.3/owl.theme.css"}
    %script{:src => "https://cdnjs.cloudflare.com/ajax/libs/owl-carousel/1.3.3/owl.carousel.js"}

1 ответ

Решение

Вы неправильно связываете внешние таблицы стилей.

Если у вас есть что-то вроде:

= stylesheet_link_tag    'application'

Найти каждый .css файл, который у вас есть, и добавьте его к нему через запятую. Подобно:

= stylesheet_link_tag    'application', "some css file" 

Вы можете избавиться от других %script в вашем коде (для css файлы, оставьте .js в одиночестве)

Другие вопросы по тегам