2016-03-22 2 views
1

Я использую Foundation 6, и я хочу использовать Orbit для отображения нескольких фотографий для арендатора лодки. Но это не работает должным образом. Я могу использовать предыдущую кнопку, но не следующую. И после использования один раз ничего не работает.Orbit Foundation - не работает

Вот это пример: http://www.boatvisor.com/renters/1

просмотров/макеты/application.html.haml

!!! 
%html.no-js{:lang => "fr"} 
    %head 
    %meta{:content => "text/html; charset=UTF-8", "http-equiv" => "Content-Type"}/ 
    = render 'layouts/head' 
    - if Rails.env.production? 
     = render 'shared/analytics' 
    %body 
    %header.container 
     = render 'layouts/header' 

    - if notice 
     %p.alert.alert-success= notice 
    - if alert 
     %p.alert.alert-danger= alert 
    %div 
     = yield 
    %div 
     = render 'layouts/footer' 
    %script{:src => "https://code.jquery.com/jquery-2.2.0.min.js"} 
    %script{:src => "https://cdnjs.cloudflare.com/ajax/libs/fastclick/1.0.6/fastclick.min.js"} 
    %script{:src => "https://cdn.jsdelivr.net/foundation/6.2.0/foundation.min.js"} 
    %script{:src => "https://cdn.jsdelivr.net/foundation/6.2.0/js/foundation.core.js"} 
    %script{:src => "https://cdn.jsdelivr.net/foundation/6.2.0/js/foundation.orbit.js"} 
    %script{:src => "https://cdn.jsdelivr.net/foundation/6.2.0/js/foundation.reveal.js"} 
    %script{:src => "//maps.google.com/maps/api/js", :type => "text/javascript"} 
    %script{:src => "//google-maps-utility-library-v3.googlecode.com/svn/tags/markerclustererplus/2.0.14/src/markerclusterer_packed.js", :type => "text/javascript"} 

    = javascript_include_tag "application" 

    = yield(:js) 

просмотров/арендаторы/.html.haml

.row 
    .large-8.columns.renter-picture 
    %ul.orbit-container{"data-orbit" => ""} 
     - @renter.photos.each do |pic| 
     %button.orbit-previous 
      %span.show-for-sr Previous Slide 
      ◀︎ 
     %button.orbit-next 
      %span.show-for-sr Next Slide 
      ▶︎ 
     %li.orbit-slide 
      = image_tag pic.image 

активы/JavaScripts /application.js

//= require jquery 
//= require jquery_ujs 
//= require underscore 
//= require gmaps/google 
//= require foundation 
//= require gritter 
//= require_tree . 
$(document).foundation(); 

активы/таблиц стилей/application.scss

*= require_self 
*= require gritter 
*= require jquery-ui 
*= require commontator/application 
*= require_tree . 
*/ 
+1

Оказывается Фонд 6 Motion UI является автономным CSS вам нужно для Obit и Reveal, попробуйте включить его, вот документ Foundation 6 для его установки: http://foundation.zurb.com/sites/docs/motion-ui.html#installing –

ответ

Смежные вопросы