我看到了这个网站http://www.montere.it/?lang=en,我喜欢他们在网站上使用Javascript的方式。向下滚动时,图像会略微出现并翻转。我已经尽力在网上找到样本,但没有一个是这样的。或者至少任何人都可以给我一个拥有Javascript集合的网站。
感谢您的所有帮助。
答案 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
类添加到元素中。