Question

我有一个图像，它实际上是带有“喜欢”按钮的图像:)。

我希望它从屏幕右侧滑出，即我将页面向下滚动到底部。怎么做？

也许是jquery？但是如何？

Answer 1

为图像提供比窗口宽度大的css left位置。比使用例如jQuery.animate来移动它。

HTML：

<img src="http://www.vpul.upenn.edu/platthouse/files/FB_button_1.jpg">

CSS：

img {
  position: absolute;
  left: 1000px;
}
body{
  overflow: hidden;
}

JS：

setTimeout(function(){$('img').animate({left: 10}, 500)}, 1000);

示例：

jsfiddle

Answer 2

我认为this jsfiddle会做你想要的。

当用户向下滚动100个像素并且（经常被遗忘）当用户向上滚动时，该按钮被jQuery动画化。

$(document).ready(function () {
    var like = $('#fblike');

    $(window).scroll(function () {
        if ($(document).scrollTop() > 100) {
            like.animate({
                opacity: 1,
                right: 5
            }, 300);
        }
        else {
                like.animate({
                opacity: 0,
                right: -60
                }, 200);
        }        
    });
});

如何从屏幕外显示图像？

2 个答案: