滚动

src/assets/styles/style.css

@@ -7,15 +7,16 @@ input:focus,button:focus,textarea:focus {
 }
 html,body {
     width: 100%;
-    height: 100%;
-    overflow-y: scroll;
+    height: auto;
+    /*overflow-y: scroll;*/
+    position: relative;
     -webkit-overflow-scrolling : touch;
     background:rgba(243,243,243,1);
 }
 
 #app {
     width: 100%;
-    height: 100%; 
+    height: auto; 
 }
 
 .m-page {

src/components/nav-bottom.vue

@@ -54,7 +54,7 @@
 	font-weight:400;
 	display: block;
 }
-a.active {
+.router-bottom a.active {
 	color: #29B079;
 }
 </style>

src/view/home.vue

@@ -1,7 +1,8 @@
 
 <template>
-	<div class="home">
-		<div ref="test" class="page-top">		
+	<div class="home" style="height: auto;">
+		 <div style="height: 0.9rem;"></div> 
+		<div ref="header" class="page-top" id="top-nav" >		
 			<i class="position" @click="show = true"><img src="../assets/images/icon/position.png"/>{{defaultCity}}</i>
 			<i class="logo"><img src="../assets/images/icon/logo.png" /></i>
 			<i class="text"><a href="tel:400-6080100">联系客服</a></i>
@@ -42,8 +43,8 @@
 					</li>
 				</ul>
 			</div>
+			<div style="height:1rem"></div>
 		</div>
-		
 		<div class="page-bottom">
 			<routerFooter></routerFooter>
 		</div>
@@ -92,6 +93,7 @@
           			}
 			    },
 			    showLoading: true,
+			    searchBarFixed: false,
 			};
 		},
 		components: {
@@ -130,7 +132,6 @@
 		   			"merchantNo": this.merchantNo,
 		   			"selectedDistrictId": this.districtId
 		   		}
-		   	//	console.log(params)
 		   		homeApi.getGoods(params).then(res => {
 		   			that.showLoading = false
 					if ( res.code == 0 ){
@@ -182,7 +183,7 @@
 		   	//获取默认地址信息
 		   	getdefaultAddress (){
 		   		homeApi.getdefaultAddress().then(res => {
-		   			console.log('默认地址信息',res)
+		   		//	console.log('默认地址信息',res)
 		   			if ( res.code == 0 ){
 		   				if ( !res.data ){
 		   					this.show = true
@@ -202,17 +203,36 @@
 		   			console.log(this.merchantNo)
 		   			this.getGoodsList()
 				});
-				
-		   	},
+		   	}
 		},
 		mounted() {
 	        //异步加载
 	      	this.getdefaultAddress()
 	      	this.getAddress()
+			
+//			window.onscroll = function() {
+//				
+//			  	var top = $(window).scrollTop() 		  
+//			  	console.log(top);
+//			  	if(top > 20){
+//			  		$('#top-nav').css({
+//			  			'position': 'fixed'
+//			  		})
+//			  	}else {
+//			  		$('#top-nav').css({
+//			  			'position': 'relative'
+//			  		})  	
+//			 	}
+//			};
+	      	
+		},
+		destroyed () {
+			
 		}
 	};
 </script>
 
+
 <style>
 .home {
 	width: 100%;
@@ -225,11 +245,12 @@
 	display: flex;
 	align-items: center;
 	justify-content: space-around;
-	z-index: 1000;
-    position: absolute;
+	z-index: 100;
+    position: fixed;
     top: 0;
     left: 0;
 }
+
 .home .page-top i {
 	font-style: normal;
 	display: flex;
@@ -261,11 +282,11 @@
 }
 .home .page-content {
 	background:rgba(255,255,255,1);
-	padding-bottom: 1rem;
 	-webkit-overflow-scrolling : touch;
 	overflow-y: scroll;
 	position: relative;
 	top: 0;
+	z-index: 10;
 }
 .home .page-content .banner {
 	max-height: 3rem;
@@ -403,6 +424,7 @@
 	position: fixed;
 	bottom: 0;
 	background:rgba(255,255,255,1);
+	z-index: 130;
 }
 .picke-address .status-btn {
 	display: flex;
@@ -443,4 +465,6 @@
 .Loading-box .weui-icon_toast.weui-loading {
 	margin-top: 75%;
 }
+
+
 </style>