由于某种原因,bootstrap不允许我以js设置间隔时间。
我正在使用Middleman将我的静态网站提供给localhost,我似乎无法让js影响来自bootstrap的轮播。我加载了bootstrap和我的自定义js
!!!
%html
%head
%title Save Rosie
%meta{charset: "utf-8"}/
/ Always force latest IE rendering engine or request Chrome Frame
%meta{content: "IE=edge,chrome=1", "http-equiv" => "X-UA-Compatible"}/
/ Use title if it's in the page YAML frontmatter
= stylesheet_link_tag "fonts", "all", "bootstrap"
= javascript_include_tag "jquery-1.11.0.min", "all", "bootstrap"
%body{class: page_classes}
= yield
旋转木马功能齐全
.carousel.slide{ "data-ride" => "carousel" }
.carousel-inner
.item.active
%img{ :src => 'https://s3-us-west-2.amazonaws.com/rosiesdonations/Rosie1.png', :alt => "Rosie Picture one" }
.item
%img{ :src => 'https://s3-us-west-2.amazonaws.com/rosiesdonations/Rosie2.jpg', :alt => "Rosie Picture two" }
.item
%img{ :src => 'https://s3-us-west-2.amazonaws.com/rosiesdonations/Rosie3.jpg', :alt => "Rosie Picture three" }
但是当我打电话时
$('.carousel').carousel({
interval: 2000
})
在all.js中它不会在2秒时切换,而是默认为5。
看起来有一个错误:未捕获TypeError:对象[object Object]没有方法'carousel'
我首先尝试加载引导程序,但它不起作用。
答案 0 :(得分:2)
在您的脚本中bootstrap.js
必须在all.js
之前。
答案 1 :(得分:0)
我不确定这是否有问题,但尝试使用class="active"
设置第一个Carousel幻灯片项,然后以这种方式初始化轮播的js:
$(function(){
$('.carousel').carousel({
interval: 2000
});
});