|
@@ -2,12 +2,13 @@
|
2
|
2
|
<template>
|
3
|
3
|
<div class="project-index">
|
4
|
4
|
<img src="@/assets/perjectImages/langbgm.jpg" width="100%" class="bgiclass" @load="handleImageLoad"/>
|
5
|
|
- <div class="index-pos-hander" :style="handleStyle">
|
|
5
|
+ <div class="index-project-swiper" :style="swiperStyle" ref="swiperRef">
|
|
6
|
+ <div class="index-pos-hander" >
|
6
|
7
|
<img :src="require('@/assets/perjectImages/swiperButton.png')" alt="">
|
7
|
8
|
</div>
|
8
|
|
- <div class="index-project-swiper" :style="swiperStyle" ref="swiperRef">
|
9
|
9
|
<project-swiper v-if="swiperShow" @clickItem="handleShow"></project-swiper>
|
10
|
10
|
</div>
|
|
11
|
+ <img src="@/assets/perjectImages/indexbottom.jpg" width="100%" class="bgiclass" @load="handleImageLoad"/>
|
11
|
12
|
<div v-for="(item, index) in list" :key="item.image">
|
12
|
13
|
<yz-modal :visible="visible[index]" class="project-modal" @touchmove.native="handleMove">
|
13
|
14
|
<div class="modal-inner">
|
|
@@ -107,6 +108,7 @@ export default {
|
107
|
108
|
|
108
|
109
|
<style lang="scss" scoped>
|
109
|
110
|
.project-index {
|
|
111
|
+ overflow-x: hidden;
|
110
|
112
|
background: #f0f0f0;
|
111
|
113
|
position: relative;
|
112
|
114
|
|
|
@@ -116,8 +118,8 @@ export default {
|
116
|
118
|
width: 81px;
|
117
|
119
|
height: 56px;
|
118
|
120
|
animation: slidefade 2s infinite;
|
119
|
|
- right:0;
|
120
|
|
- bottom: 0;
|
|
121
|
+ right:-75px;
|
|
122
|
+ bottom: 50px;
|
121
|
123
|
img {
|
122
|
124
|
width: 100%;
|
123
|
125
|
height: 100%;
|
|
@@ -127,8 +129,8 @@ export default {
|
127
|
129
|
.index-project-swiper {
|
128
|
130
|
position: relative;
|
129
|
131
|
box-sizing: border-box;
|
130
|
|
- margin: 0 15px;
|
131
|
|
- width: calc(100vw - 30px);
|
|
132
|
+ margin: 0 70px;
|
|
133
|
+ width: calc(100vw - 140px);
|
132
|
134
|
}
|
133
|
135
|
|
134
|
136
|
.project-modal {
|