Browse Source

feat: 调整foot的机制

SongZihuan 3 years ago
parent
commit
a1b0dfcb9f
2 changed files with 21 additions and 16 deletions
  1. 0 4
      static/styles/auth/role.css
  2. 21 12
      templates/base.html

+ 0 - 4
static/styles/auth/role.css

@@ -4,7 +4,3 @@
     border: 2px solid #6b6882;
     padding: 15px;
 }
-
-#RoleTabDiv {
-    min-height: 40vh;
-}

+ 21 - 12
templates/base.html

@@ -108,19 +108,28 @@
         {{ conf['FOOT'] }}
     </footer>
     <script>
+        function SetFooter (mutationsList, observer) {
+            let foot = document.getElementById('foot')
+            let context_height = context.getBoundingClientRect().bottom
+            let win_height = 0
+            if (window.innerHeight)
+                win_height = window.innerHeight;
+            else if ((document.body) && (document.body.clientHeight))
+                win_height = document.body.clientHeight;
+
+            if (win_height - context_height - foot.clientHeight <= 0)
+                foot.style.marginTop = "0"
+            else
+                foot.style.marginTop = (win_height - context_height - foot.clientHeight).toString() + "px"
+        }
+        let MutationObserver = window.MutationObserver;
+        let observer = new MutationObserver(SetFooter);
         let context = document.getElementById('context')
-        let foot = document.getElementById('foot')
-        let context_height = context.getBoundingClientRect().bottom
-        let win_height = 0
-        if (window.innerHeight)
-            win_height = window.innerHeight;
-        else if ((document.body) && (document.body.clientHeight))
-            win_height = document.body.clientHeight;
-
-        if (win_height - context_height - foot.clientHeight <= 0)
-            foot.style.marginTop = "0"
-        else
-            foot.style.marginTop = (win_height - context_height - foot.clientHeight).toString() + "px"
+        observer.observe(context, {
+            attributes: true, // 属性的变动
+            subtree: true, // 是否将观察器应用于该节点的所有后代节点
+        });
+        SetFooter()
     </script>
 {% endblock %}