Jquery在线手册动画效果

最新推荐文章于 2025-07-20 16:17:37 发布

原创最新推荐文章于 2025-07-20 16:17:37 发布 · 168 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#jquery #前端 #javascript

文章展示了如何使用HTML和CSS创建一个动态的网页加载效果，通过3D旋转和缩放动画，实现页面初始化时的视觉吸引力。

<!DOCTYPE html>
<html>
  <head>
   <meta charset="utf-8" />
   <title></title>
  </head>
  <body id="gdt">
    <style>
      #gdt {
         animation-name: html_page;
         animation-duration: 600ms;
         animation-timing-function: ease-in-out;
       }
      @keyframes html_page {
         0% {
           transform-origin: 50% 50%;
           transform: rotate3d(0, 1, 0, 720deg) rotateZ(45deg) scale(0);
        }
         100% {
           transform: rotate3d(0, 1, 0, 0) rotateZ(0) scale(1);
        } 
      }
    </style>
  </body>
</html>