fea(Led Avi): 呼吸灯效果编写

src/views/LedCarouselAvi/components/ElectrophoresisJump.vue

+<template>
+    <!-- 电泳跳转页面 -->
+    <div class="page-pack">
+        <div class="container">
+            <!-- 显示区域 -->
+            <div class="view-pack">
+                <div class="edectroppresis-pack"></div>
+            </div>
+        </div>
+    </div> 
+</template>
+
+<script>
+    export default {
+        data () {
+            return {}
+        }
+    }
+</script>
+
+<style lang="scss" scoped>
+    .page-pack {
+        height: 100%;
+        width: 100%;
+        .container {
+            width: 1556px;
+            height: 1037px;
+            background: url("../../../assets/images/LedCarouselAvi/led_avi_jump_bg.png");
+            overflow: hidden;
+            // 显示区域
+            .view-pack {
+                height: 896px;
+                width: 1298px;
+                margin-top: 106px;
+                margin-left: 130px;
+                position: relative;
+                // 边缘闪光特效
+                @keyframes shine {
+                    0% {
+                        border-color: rgba(255,255,255,0);
+                        box-shadow: 0px 0px 0px inset rgba(255,255,255,0);
+                    }
+                    100% {
+                        border-color: rgba(255,255,255,1);
+                        box-shadow: 0px 0px 200px inset rgba(255,255,255,1);
+                    }
+                }
+
+                .edectroppresis-pack {
+                    width: 546px;
+                    height: 333px;
+                    position: absolute;
+                    top: 0;
+                    left: 0;
+                    animation: shine 1000ms ease-out infinite alternate;
+                }
+            }
+        }
+    }
+</style>
\ No newline at end of file

src/views/LedCarouselAvi/index.vue

 <template>
     <div class="page-pack">
         <div class="container">
+            <!-- 电泳工作区跳转页面 -->
+            <ElectrophoresisJump></ElectrophoresisJump>
             <!-- 电泳工作区 -->
             <!-- <Electrophoresis></Electrophoresis> -->
             <!-- 钣金工作区 -->
@@ -20,16 +22,18 @@
 </template>
 
 <script>
-    import Electrophoresis from './components/Electrophoresis'
-    import SheetMetal from './components/SheetMetal'
-    import SealedAnticorrosion from './components/SealedAnticorrosion'
-    import Putty from './components/Putty'
-    import MiddleCoat from './components/MiddleCoat'
-    import ComplexionPaint from './components/ComplexionPaint'
-    import finished from './components/Finished'
+    import ElectrophoresisJump from './components/ElectrophoresisJump';
+    import Electrophoresis from './components/Electrophoresis';
+    import SheetMetal from './components/SheetMetal';
+    import SealedAnticorrosion from './components/SealedAnticorrosion';
+    import Putty from './components/Putty';
+    import MiddleCoat from './components/MiddleCoat';
+    import ComplexionPaint from './components/ComplexionPaint';
+    import finished from './components/Finished';
 
     export default {
         components: {
+            ElectrophoresisJump,
             Electrophoresis,
             SheetMetal,
             SealedAnticorrosion,