py 2 年 前
親
コミット
c1de0a7536
1 ファイル変更、26 行追加、20 行削除
  1. 26 20
      pages-buy/group.vue

+ 26 - 20
pages-buy/group.vue

@@ -29,17 +29,18 @@
 							{{siftSort}}
 							{{siftSort}}
 						</view>
 						</view>
 					</view>
 					</view>
-					<view v-show="pop_type" class="pop-box" :style="[{'top': pop_top + 'px'}]">
-						<view class="pop-content" :class="pop_type?'pop-box-true':'pop-box-false'">
 
 
+				</view>
+				<view class="pop-box" :style="[{'top': pop_top + 'px'}]" :class="[{'pop-box-z':pop_type}]">
+					<view class="pop-content" :class="pop_type?'pop-box-true':'pop-box-false'">
+						<view class="">
+							1111111111111111111000000000000000000000000000000000000000000000000000000000
 						</view>
 						</view>
-						<view class="pop-mask" @click="pop_type = !pop_type"></view>
 					</view>
 					</view>
+					<view v-show="pop_type" class="pop-mask" @click="pop_type = !pop_type"></view>
 				</view>
 				</view>
-
 				<view class="p-12-24 box-border-box">
 				<view class="p-12-24 box-border-box">
 					<view class="h-200" v-for="(item,index) in 10">
 					<view class="h-200" v-for="(item,index) in 10">
-
 					</view>
 					</view>
 				</view>
 				</view>
 			</view>
 			</view>
@@ -74,6 +75,7 @@
 				scroll_top: 0, //滚动条高度
 				scroll_top: 0, //滚动条高度
 				pop_top: 0, // pop距头部距离
 				pop_top: 0, // pop距头部距离
 				pop_type: false,
 				pop_type: false,
+				pop_type_two: false,
 				navListHeight: '', //头部模块高度
 				navListHeight: '', //头部模块高度
 				siftDistance: '附近', //距离筛选
 				siftDistance: '附近', //距离筛选
 				siftSort: '距离优先', //排序筛选
 				siftSort: '距离优先', //排序筛选
@@ -188,40 +190,44 @@
 <style scoped lang="scss">
 <style scoped lang="scss">
 	.pop-box {
 	.pop-box {
 		width: 100%;
 		width: 100%;
-		height: 100vh;
+		// height: 100vh;
+		height: 84rpx;
 		position: fixed;
 		position: fixed;
 		left: 0;
 		left: 0;
 		top: 0;
 		top: 0;
 		overflow: hidden;
 		overflow: hidden;
-		transition: all .3s linear;
+		// z-index: -1;
+		// transition: all 0.3s ease-in-out;
 	}
 	}
-
+	// .pop-box-z {
+	// 	z-index: 2;
+	// 	transition: all 0.3s ease-in-out;
+	// }
 	.pop-box-true {
 	.pop-box-true {
-		height: 500rpx;
-		transition: all .3s linear;
+		// display: block;
+		// transition: all .3s inherit;
 		/* 定义过渡效果 */
 		/* 定义过渡效果 */
-		// transform: translateY(-200px);
+		transition: transform 0.3s ease-in-out;
+		transform: translateY(0);
 	}
 	}
 
 
 	.pop-box-false {
 	.pop-box-false {
-		height: 0;
-		transition: all .3s linear;
-		/* 定义过渡效果 */
-		// transform: translateY(0);
+		// display: none;
+		transition: transform 0.3s ease-in-out;
+		transform: translateY(-100%);
 	}
 	}
 
 
 	.pop-content {
 	.pop-content {
 		width: 100%;
 		width: 100%;
-		// height: 0;
+		height: 500rpx;
 		background: #fff;
 		background: #fff;
 		border-radius: 0 0 20rpx 20rpx;
 		border-radius: 0 0 20rpx 20rpx;
-		position: relative;
+		position: absolute;
 		left: 0;
 		left: 0;
 		// top: var(--pop_top)px;
 		// top: var(--pop_top)px;
 		z-index: 10;
 		z-index: 10;
-		transition: all .3s linear;
+		// transition: all .3s inherit;
 		/* 定义过渡效果 */
 		/* 定义过渡效果 */
-		// transform: translateY(0);
 		/* 初始平移状态 */
 		/* 初始平移状态 */
 	}
 	}
 
 
@@ -231,7 +237,7 @@
 		background: rgba(0, 0, 0, .5);
 		background: rgba(0, 0, 0, .5);
 		position: absolute;
 		position: absolute;
 		left: 0;
 		left: 0;
-		top: 0;
+		// top: 0;
 	}
 	}
 
 
 	.siftClass {
 	.siftClass {