diff --git a/static/js/animate.js b/static/js/animate.js
index 6d3f3836066e3f9f8ff783ecf441632ad014213b..39d5057132754d30a69e451c381f059374f06763 100644
--- a/static/js/animate.js
+++ b/static/js/animate.js
@@ -21,4 +21,62 @@ $('.pic-display').each(function (item) {
             $('.pic-display').eq(item).css('display', 'none');
         });
     });
+});
+var lastWinPos;
+
+// 旋转入场动画
+function rotatan(ele) {
+    var winPos = $(window).scrollTop();
+    var boxh = ele.offset().top;
+    var box = ele[0];
+    var height = ele.height()*0.5
+    if( winPos > lastWinPos){
+        if(boxh - 0.8*$(window).height() < winPos && winPos< boxh+ ele.height()){
+            anime({
+                targets: box,
+                translateX: 0,
+                translateY: -height,
+                duration: 800,
+                opacity: 1,
+                rotate: '1turn'
+              });
+        }
+        if(boxh + 0.5*ele.height() < winPos && winPos< boxh + ele.height()){
+            anime({
+                targets: box,
+                translateX: 250,
+                translateY: -height,
+                duration: 800,
+                opacity: 0,
+                rotate: '2turn'
+              });
+        }
+    }else{
+        if(boxh - 0.8*$(window).height() > winPos ){
+            anime({
+                targets: box,
+                translateX: 250,
+                translateY: -height,
+                duration: 800,
+                opacity: 0,
+                rotate: '3turn'
+              });
+        }
+        if(boxh + 0.5*ele.height() < winPos && winPos< boxh + ele.height()){
+            anime({
+                targets: box,
+                translateX: 0,
+                translateY: -height,
+                opacity: 1,
+                duration: 800,
+                rotate: '4turn'
+              });
+        }
+    }
+    lastWinPos = winPos;
+}
+
+$(window).scroll(function(){
+    $('.home').find('h2').eq(0).css('translateX', '250px');
+    rotatan($('.home').find('h2').eq(0));
 });
\ No newline at end of file
diff --git a/wiki/pages/index.html b/wiki/pages/index.html
index 89b9219b42787011f698ed1ccf9801080e21e590..11f8768746a29662e6d973e0e21ec72049f83051 100644
--- a/wiki/pages/index.html
+++ b/wiki/pages/index.html
@@ -7,7 +7,7 @@
 
 {% block page_content %}
 
-<div class="row">
+<div class="row home">
     <div class="bigbox">
         <h2>BACKGROUND</h2>
         <p>THE ocean is Hainan's greatest advantage and its greatest potential in the future. As the
diff --git a/wiki/pages/parts.html b/wiki/pages/parts.html
index edade5fec5ed122a399b52a82fb4c7c7b9dffc5c..237748c27ea4a0163704a55560957806032cea70 100644
--- a/wiki/pages/parts.html
+++ b/wiki/pages/parts.html
@@ -1,5 +1,5 @@
 {% extends "layout.html" %}
-
+{% block htitle %}Parts{% endblock %}
 {% block title %}Parts{% endblock %}
 {% block lead %}This page contains information about the parts created by the team.{% endblock %}