使用css和/或Jquery进行动画效果

Question

是否有任何Jquery插件或CSS代码具有如下页面中的效果 http://engineer.org.in/2013/和http://engineer.org.in/2013/#Comps（不使用webGL）...

Answer 1

加载页面??它只是一个带有jquery代码的gif图像

<script>
$(window).load(function(){
  $('#dvLoading').fadeOut(2000);
});
</script>

阅读此link

加载事件后，您有一个转换事件。你可以使用css3 Transitions和Tranforms

来做到这一点

在这种情况下，我们使用left和scaling属性。想象一下你有一个立方体类：

transEx {
    background-color: #066882;
    -webkit-transition: all 3s;
    -moz-transition: all 3s;
    -o-transition: all 3s;
    transition: all 3s;
}
.cude:hover {
    background-color: #FC8F30;
    color: #000;
    -webkit-transform: translate(900px, 0);
    -moz-transform: translate(900px, 0);
    -o-transform: translate(900px, 0);
    transform: translate(900px, 0);
}

查看我的example here!

我建议关注css3 Transitions Tutorial

另一方面，您可以使用Jquery库。只关注effects category。在此链接中，您可以看到很多示例。