平常在浏览网页时,我们经常可以看到各种炫丽的动画效果,例如下拉菜单、图片轮播、浮动广告等。使用动画效果可以让页面更加酷炫,也可以优化页面的用户体验。就拿我们都熟悉的淘宝来说,首页图片的轮播每隔几秒就轮播一次,十分酷炫,大家可以去感受一下。如图 1 所示。
现在 HTML5 和 CSS3 发展比较快,不少小伙伴可能都接触过 CSS3 动画。实际上,使用 CSS3 实现动画相对于使用 jQuery 实现动画更加简单。在实际开发中,如果想要一个动画效果,建议大家优先考虑使用 CSS3 来实现。如果实现不了,再去考虑使用 jQuery。
我们可能就会问了:“既然都说使用 CSS3 来实现动画更加简单方便,为什么还要学习 jQuery 动画呢?”实际上,使用 CSS3 来实现动画有一定的局限性,有些地方必须使用 jQuery 才能实现动画,例如下面几种情况:
当然,我们只有把 jQuery 动画学完才会有更深的认识。