Question

我正在使用scrollmagic.io，并正在制作锚点导航菜单。我正在关注this tutorial。滚动条起作用了！

除非它是滚动回到开头而不是滚动到该页面。

这是我的代码：

// init controller
var controller = new ScrollMagic.Controller();

// animate scroll instead of a jump
controller.scrollTo(function(target) {
  console.log('scroooooll');
  console.log('target = '+target); // THIS IS PRINTING 0
  console.log(typeof(target));
  /* Commenting out what it should do for simplicity. */
});

// scroll action when you click the nav links
$(document).on('click', 'a[href^=#]', function(e) {
  var id = $(this).attr('href'); // get the href of clicked link
  if ($(id).length > 0) { // not empty links
    e.preventDefault(); // prevent normal link action

    // this is the function call
    console.log('click');
    console.log('id = '+id); // IT PRINTS CORRECT HERE
    console.log(typeof(id));
    controller.scrollTo(id); // scroll on click

    // update the URL
    if (window.history && window.history.pushState) {
      history.pushState("", document.title, id);
    }
  }
});

这是我的控制台日志的输出：

click
id = #{the-href-value}
string
scroooooll
target = 0
number

我的Javascript非常生锈，但这对我来说似乎不对。当我将变量作为参数传递时，为什么将变量从字符串更改为0？

Answer 1

从文档中

”此功能将用于以后的滚动位置修改。这为您提供了一种更改滚动和添加动画等新行为。该函数接收新的滚动位置作为参数和对容器的引用元素使用此。它还可以选择接收可选附加参数（请参见下文）”

因此，第一个参数由控制器传递。之后，您将获得参数。

http://scrollmagic.io/docs/ScrollMagic.Controller.html#scrollTo

尝试打印console.log(args);

controller.scrollTo(function(scrollPos, targetHrefISent) {
  console.log('scroooooll');
  console.log('target = '+targetHrefISent); // THIS IS PRINTING 0
  console.log(typeof(targetHrefISent));
  /* Commenting out what it should do for simplicity. */
});

Javascript，将我的字符串作为参数传递会将其变为0

1 个答案: