任一存 3 年之前
父節點
當前提交
941f0d02a5
共有 3 個文件被更改,包括 54 次插入15 次删除
  1. 1 1
      web/src/views/Collections/component/info.vue
  2. 52 13
      web/src/views/LearnEngage/index.vue
  3. 1 1
      web/src/views/accessibility.vue

+ 1 - 1
web/src/views/Collections/component/info.vue

@@ -167,7 +167,7 @@ export default {
 </script>
 <style lang='less' scoped>
 .CollectionsInfo {
-  z-index: 4;
+  z-index: 991;
   position: fixed;
   top: 0;
   left: 0;

+ 52 - 13
web/src/views/LearnEngage/index.vue

@@ -1,8 +1,17 @@
 <template>
   <div class="LearnEngage">
-    <div class="ban" data-aria-viewport-area tabindex="0"
-      aria-label :aria-description="`You've reached the banner area of the ${currentTabText} page; this section has one image; please use the tab key to go through the content.`"
-    ></div>
+    <div class="banWrapper"
+      tabindex="0"
+      data-aria-viewport-area
+      aria-label
+      :aria-description="`You've reached the banner area of the ${currentTabText} page; this section has one image; please use the tab key to go through the content.`"
+    >
+      <div class="ban"
+        tabindex="0"
+        aria-label="Image"
+        :aria-description="currentTabText"
+      ></div>
+    </div>
     <div class="nav_2" data-aria-viewport-area tabindex="0"
       aria-label aria-description="You've reached the secondary menu of the Learn & Engage section; this menu has three options; please use the tab key to go through the menu."
     >
@@ -12,6 +21,10 @@
           v-for="(item, index) in topLi"
           :key="index"
           @click="skip(item.url)"
+          @keydown.enter.passive="skip(item.url)"
+          tabindex="0"
+          aria-label="Link"
+          :aria-description="item.name"
         >
           <img :src="`/data/LearnEngage/${index + 1}.png`" alt="" />
           <p>{{ item.name }}</p>
@@ -22,12 +35,28 @@
     <div class="pos" data-aria-viewport-area tabindex="0"
       aria-label aria-description="You've reached the path area, please use the tab key to navigate through the content."
     >
-      <span class="pos1">Your Position:&nbsp;</span>
-      <Router-link to="/Layout/Home">Home></Router-link>
-      <Router-link to="/Layout/LearnEngage/Students"
-        >Learn & Engage></Router-link
+      <span class="pos1" tabindex="0">Your Position:&nbsp;</span>
+      <Router-link
+        to="/Layout/Home"
+        tabindex="0"
+        aria-description="Home"
+      >
+        Home>
+      </Router-link>
+      <Router-link
+        to="/Layout/LearnEngage/Students"
+        tabindex="0"
+        aria-description="Learn & Engage"
+      >
+        Learn & Engage>
+      </Router-link>
+      <Router-link
+        to=""
+        tabindex="0"
+        :aria-description="currentTabText"
       >
-      <span>{{currentTabText}}</span>
+        {{currentTabText}}
+      </Router-link>
     </div>
     <!-- 内容 -->
     <div class="conten" data-aria-viewport-area tabindex="0"
@@ -38,14 +67,19 @@
         v-for="item in data[pageSize - 1]"
         :key="item.id"
         @click="toInfo(item.id)"
+        @keydown.enter.passive="toInfo(item.id)"
       >
         <div class="left">
-          <h3>{{ item.h3 }}</h3>
-          <p>{{ item.p }}</p>
-          <h4 v-html="item.h4"></h4>
+          <h3 tabindex="0">{{ item.h3 }}</h3>
+          <p tabindex="0">{{ item.p }}</p>
+          <h4 v-html="item.h4" tabindex="0"></h4>
         </div>
         <div class="right">
-          <img :src="`/data/LearnEngage/sm/${item.id}.png`" alt="" />
+          <img :src="`/data/LearnEngage/sm/${item.id}.png`"
+            :alt="item.h3" 
+            tabindex="0"
+            :aria-description="item.h3"
+          />
         </div>
       </div>
       <!-- 分页 -->
@@ -55,8 +89,13 @@
           v-for="i in pageNum"
           :key="i"
           @click="pageChange(i)"
-          >{{ i }}</span
+          @keydown.enter.passive="pageChange(i)"
+          tabindex="0"
+          aria-label="Link"
+          :aria-description="`page ${i}`"
         >
+          {{ i }}
+        </span>
       </div>
     </div>
   </div>

+ 1 - 1
web/src/views/accessibility.vue

@@ -996,7 +996,7 @@ a {
   position: fixed;
   top: 0;
   width: 100%;
-  z-index: 5;
+  z-index: 1000;
   .crosshair-h {
     position: fixed;
     width: 100%;