如何初始化基础3使用轨道？ [英] How To Initialize Foundation 3 To Use Orbit?

问题描述

我正在尝试使用我在此问题中找到的脚本在Foundation 3中运行Orbit，但我不能让它正确初始化。我在页脚中添加了此脚本，在标题中添加了Foundation.min.js。我在我的控制台的第3行得到了一个no方法'基础'错误它不起作用。

I am trying to use a script I found in this question to run Orbit in Foundation 3, but I can not get it to initialize properly. I added this script in the footer and Foundation.min.js in the header. I get a no method 'foundation' error on line 3 in my console it doesn't work.

推荐答案

您链接的SO线程将不适用于您，因为它使用Foundation 4. Orbit在Foundation 3（F3）中初始化不同。所以假设你有一个id orbitX 的元素。你初始化它是这样的：

The script in that SO thread you linked to will not work for your because it uses Foundation 4. Orbit is initialized differetly in Foundation 3 (F3). So suppose you have an element with id orbitX. You initialize it like this:

$("#orbitX").orbit();

在你提出的另一个SO问题中

In the other SO question you asked

你会在哪里添加其他设置？

where would you add additional settings?

你在初始化你的轨道元素时这样做：

You do it when you initialized your orbit element like this:

$("#orbitX").orbit({
    bullets: false; // to hide the bullets
});

以下是完整的选项

$('#orbitX').orbit({
  animation: 'fade',                  // fade, horizontal-slide, vertical-slide, horizontal-push
  animationSpeed: 800,                // how fast animtions are
  timer: true,                        // true or false to have the timer
  resetTimerOnClick: false,           // true resets the timer instead of pausing slideshow progress
  advanceSpeed: 4000,                 // if timer is enabled, time between transitions
  pauseOnHover: false,                // if you hover pauses the slider
  startClockOnMouseOut: false,        // if clock should start on MouseOut
  startClockOnMouseOutAfter: 1000,    // how long after MouseOut should the timer start again
  directionalNav: true,               // manual advancing directional navs
  captions: true,                     // do you want captions?
  captionAnimation: 'fade',           // fade, slideOpen, none
  captionAnimationSpeed: 800,         // if so how quickly should they animate in
  bullets: false,                     // true or false to activate the bullet navigation
  bulletThumbs: false,                // thumbnails for the bullets
  bulletThumbLocation: '',            // location from this file where thumbs will be
  afterSlideChange: function(){},     // empty function
  fluid: true                         // or set a aspect ratio for content slides (ex: '4x3')
});

这篇关于如何初始化基础3使用轨道？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！