任何人都可以帮我弄清楚如何使用这个Javascript吗?

时间:2015-06-03 04:11:16

标签: javascript

我看到了这个网站http://www.montere.it/?lang=en,我喜欢他们在网站上使用Javascript的方式。向下滚动时,图像会略微出现并翻转。我已经尽力在网上找到样本,但没有一个是这样的。或者至少任何人都可以给我一个拥有Javascript集合的网站。

感谢您的所有帮助。

1 个答案:

答案 0 :(得分:0)

我直接从他们的页面中删除了CSS动画代码

@keyframes flipInY {
    0% {
        -webkit-transform:perspective(1000px) rotateY(20deg);
        -ms-transform:perspective(1000px) rotateY(20deg);
        transform:perspective(1000px) rotateY(20deg);
        opacity:0
    }
    100% {
        -webkit-transform:perspective(1000px) rotateY(0deg);
        -ms-transform:perspective(1000px) rotateY(0deg);
        transform:perspective(1000px) rotateY(0deg);
        opacity:1
    }
}
.flipInY {
    -webkit-backface-visibility:visible !important;
    -ms-backface-visibility:visible !important;
    backface-visibility:visible !important;
    -webkit-animation-name:flipInY;
    animation-name:flipInY
}
.animated {
    -webkit-animation-duration:.7s;
    animation-duration:.7s;
    -webkit-animation-fill-mode:both;
    animation-fill-mode:both
}

运行JSFiddle http://charithaka.blogspot.com/2012/07/consuming-soap-service-using-wso2-api.html

基本上,当用户滚动时,您将animated类添加到元素中。