Commit 6fe9ebf880b7cb15f279e02ef5c922f726cb54c2
1 parent
800d7fe2
perf(external/Composes): 优化摄像头新增时样式错乱
Showing
1 changed file
with
9 additions
and
9 deletions
| @@ -55,35 +55,35 @@ const computedFunc = (initial: number, source: any) => { | @@ -55,35 +55,35 @@ const computedFunc = (initial: number, source: any) => { | ||
| 55 | temp4 = initial + 1 >= len ? initial + 1 - len : initial + 1, | 55 | temp4 = initial + 1 >= len ? initial + 1 - len : initial + 1, |
| 56 | temp5 = initial + 2 >= len ? initial + 2 - len : initial + 2 | 56 | temp5 = initial + 2 >= len ? initial + 2 - len : initial + 2 |
| 57 | return source?.map((item: any, index: number) => { | 57 | return source?.map((item: any, index: number) => { |
| 58 | - let transform = `translate(-50%, -50%) scale(0.7)`, | 58 | + let transform = `translateX(-50%) scale(0.7)`, |
| 59 | zIndex = 0, | 59 | zIndex = 0, |
| 60 | className = 'slide' | 60 | className = 'slide' |
| 61 | switch (index) { | 61 | switch (index) { |
| 62 | case temp3: | 62 | case temp3: |
| 63 | - transform = `translate(-50%, -50%) scale(1)` | 63 | + transform = `translateX(-50%) scale(1)` |
| 64 | className = ['slide', 'activate'] as any | 64 | className = ['slide', 'activate'] as any |
| 65 | zIndex = 300 | 65 | zIndex = 300 |
| 66 | break | 66 | break |
| 67 | case temp1: | 67 | case temp1: |
| 68 | - transform = `translate(-80%, -50%) scale(0.7)` | 68 | + transform = `translateX(-80%) scale(0.7)` |
| 69 | zIndex = 100 | 69 | zIndex = 100 |
| 70 | break | 70 | break |
| 71 | case temp5: | 71 | case temp5: |
| 72 | - transform = `translate(100%, -50%) scale(0.7)` | 72 | + transform = `translateX(100%) scale(0.7)` |
| 73 | zIndex = 100 | 73 | zIndex = 100 |
| 74 | break | 74 | break |
| 75 | case temp2: | 75 | case temp2: |
| 76 | - transform = `translate(-100%, -50%) scale(0.85)` | 76 | + transform = `translateX(-100%) scale(0.85)` |
| 77 | zIndex = 200 | 77 | zIndex = 200 |
| 78 | break | 78 | break |
| 79 | case temp4: | 79 | case temp4: |
| 80 | - transform = `translate(58%, -50%) scale(0.85)` | 80 | + transform = `translateX(58%) scale(0.85)` |
| 81 | zIndex = 200 | 81 | zIndex = 200 |
| 82 | break | 82 | break |
| 83 | } | 83 | } |
| 84 | item.sty = { | 84 | item.sty = { |
| 85 | transform, | 85 | transform, |
| 86 | - zIndex | 86 | + zIndex, |
| 87 | } | 87 | } |
| 88 | item.className = className | 88 | item.className = className |
| 89 | return item | 89 | return item |
| @@ -164,9 +164,9 @@ function changeSlide(dir: string) { | @@ -164,9 +164,9 @@ function changeSlide(dir: string) { | ||
| 164 | width: 20%; | 164 | width: 20%; |
| 165 | height: 100%; | 165 | height: 100%; |
| 166 | position: absolute; | 166 | position: absolute; |
| 167 | - top: 50%; | 167 | + // top: 50%; |
| 168 | left: 10%; | 168 | left: 10%; |
| 169 | - transform: translate(-50%, -50%); | 169 | + transform: translateX(-50%); |
| 170 | transition: 0.5s; | 170 | transition: 0.5s; |
| 171 | box-shadow: 0 0 4px black; | 171 | box-shadow: 0 0 4px black; |
| 172 | .video-title { | 172 | .video-title { |