Question

我想知道使用＆＃34; famo.us＆＃34; scrollSync。

但我无法搜索确切的解决方案。

我的代码如下。请给我一个解决方案。

var Engine     = require("famous/core/Engine");
var Surface    = require("famous/core/Surface");
var ScrollSync = require("famous/inputs/ScrollSync");
var mainContext = Engine.createContext();
var start = 0;
var update = 0;
var end = 0;
var scrollSync = new ScrollSync(function() {
    return [0,0];
});
Engine.pipe(scrollSync);
var contentTemplate = function() {
    return "<div>Start Count: " + start + "</div>" +
    "<div>End Count: " + end + "</div>" +
    "<div>Update Count: " + update + "</div>";
};
var surface = new Surface({
    size: [undefined, undefined],
    classes: ['grey-bg'],
    content: contentTemplate()
});
scrollSync.on("start", function() {
    surface.setContent(contentTemplate());
});
scrollSync.on("update", function(data) {
    surface.setContent(contentTemplate());
});
scrollSync.on("end", function() {
    surface.setContent(contentTemplate());
});
mainContext.add(surface);

Answer 1

我做了几件事来让你的代码工作。首先只使用surface.pipe（scrollSync）来获取事件滚动同步，然后实际更新start，update和end的变量。我还添加了一个方向变量，我检查事件的delta属性，以确定移动鼠标滚轮的方向。

这是一个例子..希望它有所帮助！

var Engine     = require("famous/core/Engine");
var Surface    = require("famous/core/Surface");
var ScrollSync = require("famous/inputs/ScrollSync");
var mainContext = Engine.createContext();

var start = 0;
var update = 0;
var end = 0;
var direction = undefined;

var scrollSync = new ScrollSync();

var contentTemplate = function() {
    return "<div>Start Count: " + start + "</div>" +
    "<div>End Count: " + end + "</div>" +
    "<div>Update Count: " + update + "</div>" + 
    "<div>Direction: " + direction + "</div>";
};
var surface = new Surface({
    size: [undefined, undefined],
    classes: ['grey-bg'],
    content: contentTemplate()
});

surface.pipe(scrollSync);

scrollSync.on("start", function() {
    start += 1;
    surface.setContent(contentTemplate());
});
scrollSync.on("update", function(data) {
    update += 1;
    delta = data['delta'];
    direction = delta[0] == 0 ? (delta[1] > 0 ? "down" : "up") : (delta[0] > 0 ? "right" : "left") ;
    surface.setContent(contentTemplate());
});
scrollSync.on("end", function() {
    end += 1;
    surface.setContent(contentTemplate());
});
mainContext.add(surface);

如何使用famo.us scrollSync捕获鼠标滚轮方向？

1 个答案: