ScrollMagic Class: ScrollMagic

new ScrollMagic(options)

这是每一个滚动容器都需要实例化一次的主类。

参数：

Name Type Argument Description

options

object

含有一个或多个选项作用于控制器的对象。

Properties

Name	Type	Argument	Default	Description
`container`	string \| object	<optional>	window	选择器，滚动的主容器所引用的 DOM对象或 jQuery对象。
`vertical`	boolean	<optional>	true	设置滚动模式，垂直 (`true`) 或横向 (`false`) 滚动。
`globalSceneOptions`	object	<optional>	{}	这些选项将被传递到使用 addScene 方法被添加到控制器的每一个场景。有关场景选项的详细信息，请参阅 `ScrollScene`。
`loglevel`	number	<optional>	2	调试日志等级。需要注意的是这在压缩版的 ScrollMagic 中是禁止使用的。 `0`=> 静默 `1`=> 错误 `2`=> 错误，警告 `3`=> 错误，警告，调试信息
`refreshInterval`	boolean	<optional>	100	有些更改默认不触发事件，如更改容器大小或移动中场景的元素切换。在指定间隔内轮询这些参数，以触发必要的事件。如果不使用自定义的容器，触发因素或具有静态布局，在触发元素的位置不会改变的情况下，你可以将其设置为 0 禁用时间间隔检查并提高性能。

Source:

jquery.scrollmagic.js, line 63

Example

// 基本的初始化
var controller = new ScrollMagic();

// 传递参数
var controller = new ScrollMagic({container: "#myContainer", loglevel: 3});

Control Methods 控制方法

addScene(ScrollScene) → {ScrollMagic} 添加场景

添加一个或多个场景到控制器
这相当于 ScrollScene.addTo(controller).

参数：

Name	Type	Description
`ScrollScene`	ScrollScene \| array	需要被添加到控制器的场景或场景数组。

Source:

jquery.scrollmagic.js, line 275

Returns:

Parent object for chaining.

{ ScrollMagic }

Example

// with a previously defined scene
controller.addScene(scene);

// with a newly created scene.
controller.addScene(new ScrollScene({duration : 0}));

// adding multiple scenes
controller.addScene([scene, scene2, new ScrollScene({duration : 0})]);

destroy(resetScenes) → {null} 销毁控制器

销毁控制器，全部场景和所有相关的一切。

参数：

Name	Type	Argument	Default	Description
`resetScenes`	boolean	<optional>	false	若为 `true` 则所有相关场景内的 pins 和 tweens (如果存在) 都将被重置。

Source:

jquery.scrollmagic.js, line 611

Returns:

Null to unset handler variables.

{ null }

Example

// without resetting the scenes
controller = controller.destroy();

// with scene reset
controller = controller.destroy(true);

removeScene(ScrollScene) → {ScrollMagic} 移除场景

从控制器中移除一个或多个场景。
这相当于 ScrollScene.remove().

参数：

Name	Type	Description
`ScrollScene`	ScrollScene \| array	需要从控制器中移除的场景或场景的数组。

Source:

jquery.scrollmagic.js, line 318

Returns:

Parent object for chaining.

{ ScrollMagic }

Example

// remove a scene from the controller
controller.removeScene(scene);

// remove multiple scenes from the controller
controller.removeScene([scene, scene2, scene3]);

scrollTo(scrollTarget) → {ScrollMagic} 滚动到

滚动到一个偏移量，一个 DOM元素，场景的起点或代替滚动动作的自定义方法。
对于垂直控制器，它会改变顶部滚动偏移量。而水平的应用将改变左偏移量。

参数：

Name	Type	Argument	Description
`scrollTarget`	mixed	<optional>	所提供的参数可以是下列类型之一: `number` -> 容器将滚动到这个新的滚动偏移量。 `string` or `object` -> 可以是一个选择器，一个DOM对象或一个jQuery元素。容器将滚动到该元素的位置。 `ScrollScene` -> 容器将滚动到这一场景的开始位置。 `function` -> 此方法将被用作未来滚动位置修改时的回调函数。这提供了一种方法可以让你改变滚动并添加喜欢的动画行为。回调接收新的滚动的位置作为参数，并使用 `this` 来引用容器元素。注意：当使用新的回调进行滚动时，所有其它选项仍会按照预期工作。

Since:

1.1.0

Source:

jquery.scrollmagic.js, line 437

Returns:

Parent object for chaining.

{ ScrollMagic }

Example

// scroll to an offset of 100
controller.scrollTo(100);

// scroll to a DOM element
controller.scrollTo("#anchor");

// scroll to the beginning of a scene
var scene = new ScrollScene({offset: 200});
controller.scrollTo(scene);

// define a new scroll position modification function (animate instead of jump)
controller.scrollTo(function (newScrollPos) {
	$("body").animate({scrollTop: newScrollPos});
});

update(immediately) → {ScrollMagic} 更新控制器

更新控制器参数和每一个场景，
查看 ScrollMagic.updateScene() 以获取更多信息。
大多数情况下你不需要这个方法，因为它是不断被调用的，每当 ScrollMagic 检测一个状态变更事件时，如调整尺寸或滚动时。
这个方法的唯一的应用，是当 ScrollMagic 未能检测到这些事件时。
另一种应用是与一些外部的滚动库 (如 iScroll) 协同工作，它 (iScroll) 将内部容器移动一个负的偏移量来代替实际的滚动。在这种情况下，控制器上的更新需要在子容器的位置发生变化时被调用。对于这种情况也将有必要提供一个自定义函数来计算出正确的滚动位置。查看 ScrollMagic.scrollPos() 了解更多信息。

参数：

Name	Type	Argument	Default	Description
`immediately`	boolean	<optional>	false	若为 `true` 则实时更新，若为 `false` 它将会等到下一个更新周期 (更好的性能)

Source:

jquery.scrollmagic.js, line 397

Returns:

Parent object for chaining.

{ ScrollMagic }

Example

// update the controller on next cycle (saves performance due to elimination of redundant updates)
controller.update();

// update the controller immediately
controller.update(true);

updateScene(ScrollScene, immediately) → {ScrollMagic} 更新场景

根据容器的滚动位置更新一个或多个场景。
这相当于 ScrollScene.update().
此更新方法用来计算场景的开始和结束位置（基于所述触发元件，触发挂钩，持续时间和偏移），并检查其相对于容器的当前的滚动位置。
然后，它相应地更新当前场景的状态（或什么都不做，如果状态已经是正确的） - pins 都将被设置到它们的正确位置，而 tweens 将被更新到正确的进度。
注意：此方法被调用时将不断检测 ScrollMagic 的变更。如果你想在 ScrollMagic 的领域之外改变什么，如移动 trigger 或更改 tween 的参数。

参数：

Name	Type	Argument	Default	Description
`ScrollScene`	ScrollScene			需要更新的场景或场景数组。
`immediately`	boolean	<optional>	false	若为 `true` 则实时更新，若为 `false` 它将等到下一个更新周期。改变场景的多个属性时，这是非常有用的 - 这种方式，将只进行一次更新来应用被（updateScenes）设置的所有新属性。

Source:

jquery.scrollmagic.js, line 357

Returns:

Parent object for chaining.

{ ScrollMagic }

Example

// update a specific scene on next cycle
controller.updateScene(scene);

// update a specific scene immediately
controller.updateScene(scene, true);

// update multiple scenes scene on next cycle
controller.updateScene([scene1, scene2, scene3]);

Parameters (getter / setter) 参数辅助

enabled(newState) → {boolean|ScrollMagic} 状态开关

获取或设置控制器的当前启用状态。
这可以用来，在不破坏或删除，连接到控制器的所有场景的情况下，禁用它们。

参数：

Name	Type	Argument	Description
`newState`	boolean	<optional>	控制器新的启用状态 `true` 或 `false`.

Source:

jquery.scrollmagic.js, line 587

Returns:

Current enabled state or parent object for chaining.

{ boolean | ScrollMagic }

Example

// get the current value
var enabled = controller.enabled();

// disable the controller
controller.enabled(false);

loglevel(newLoglevel) → {number|ScrollMagic} 日志级别

获取或设置当前日志级别选项的值。

参数：

Name	Type	Argument	Description
`newLoglevel`	number	<optional>	ScrollMagic控制器的新日志级别。 `[0-3]`

Source:

jquery.scrollmagic.js, line 563

Returns:

Current loglevel or parent object for chaining.

{ number | ScrollMagic }

Example

// get the current value
var loglevel = controller.loglevel();

// set a new value
controller.loglevel(3);

scrollPos(scrollPosMethod) → {number|ScrollMagic} 滚动偏移量

获取当前的滚动偏移量或设置一个新的方法来计算它。
-> 获取: 以 getter 方式使用时，该方法将返回当前的滚动位置。
可以使用 ScrollMagic.info("scrollPos") 来获取一个缓存值，这将在每一个更新周期被更新。
对于垂直的控制器返回顶部滚动偏移，而对于横向应用它将返回左偏移。

-> 设置: 当作为一个 setter 使用时，此方法将永久性地覆盖控制器的滚动位置计算方式。
一种典型的用例是，当滚动位置不是由容器的 scrollTop 或 scrollLeft 值反射，而是由内部的一个子容器的偏移决定时。
对于几个常见的滚动框架，移动父元素内部的子容器是一种常用的方法，包括 iScroll。
通过提供一个备用计算功能可以确保 ScrollMagic 接收到正确的滚动位置。
也请记住，你的函数应该为垂直滚动返回一个 y值，为水平滚动返回一个 x值。

要改变当前的滚动位置，请使用 ScrollMagic.scrollTo().

参数：

Name	Type	Argument	Description
`scrollPosMethod`	function	<optional>	用于滚动位置计算的自定义函数。

Source:

jquery.scrollmagic.js, line 497

Returns:

Current scroll position or parent object for chaining.

{ number | ScrollMagic }

Example

// get the current scroll Position
var scrollPos = controller.scrollPos();

// set a new scroll position calculation method
controller.scrollPos(function () {
	return this.info("vertical") ? -$mychildcontainer.y : -$mychildcontainer.x
});

Properties (getter) 性能

info(about) → {mixed|object} 信息

获取控制器的所有相关信息或其中之一。

参数：

Name	Type	Argument	Description
`about`	string	<optional>	如果传递参数将只返回一个指定信息，而不是包含所有信息的对象。有效的参数有： `"size"` => 容器的当前视口大小 `"vertical"` => 若垂直滚动则返回 true，反之为 false `"scrollPos"` => 当前滚动的偏移量 `"scrollDirection"` => 已知的最后的滚动方向 `"container"` => 容器元素 `"isDocument"` => 若容器元素为 document 则返回 true

Source:

jquery.scrollmagic.js, line 530

Returns:

The requested info(s).

{ mixed | object }

Example

// returns the current scroll position (number)
var scrollPos = controller.info("scrollPos");

// returns all infos as an object
var infos = controller.info();