Question

抱歉，这个问题非常初学者。我只是不知道从哪里开始我希望得到一些提示。

我需要在用户访问网页的某个部分后启动动画。我能够通过这样做找到坐标

$("body").click(function(event){
   alert("this is the x coordinate: "+event.pageX);
   alert("this is the y coordinate: "+event.pageY);

});

有人能告诉我一个我能做什么的例子，以便当用户滚动到动画开始的坐标y 1254时？我还找到了viewport.js，但文档只显示了一个非常可怕的例子

这是我尝试过的，但似乎并没有起作用

$(".second-image:in-viewport").css({marginLeft:'-999px'}).animate(
        {marginLeft:'0px'}, {duration:2000});

我似乎无法将console.log与viewport一起使用。

Answer 1

您需要检查页面滚动，然后在滚动时检查您是否离页面顶部太远或者元素是否可见。

试试这个jsfiddle：http://jsfiddle.net/LVrch/ 缩小结果窗口，因此您必须滚动一下。

这里是jQuery：

$(document).scroll(function () {
    if ($(window).scrollTop() >= 200) {
        $(".second-image").animate({
            marginLeft: '230px'
        });
    }
});

基于y轴激活动画

1 个答案: