From 9dc659a13c1f87044e254ed52a4bc5c1241cb099 Mon Sep 17 00:00:00 2001
From: Lee <342694918@qq.com>
Date: Mon, 12 Sep 2022 13:52:42 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E5=AF=BC=E8=88=AA=EF=BC=8C?=
=?UTF-8?q?=E4=BC=98=E5=8C=96=E5=95=86=E6=88=B7=E5=88=97=E8=A1=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
css/style.css | 32 ++++++++++++++++++++++++++++++++
js/script.js | 34 +++++++++++++++++++++++++---------
user/business.html | 9 +++++++++
user/detail.html | 10 +++++++++-
4 files changed, 75 insertions(+), 10 deletions(-)
diff --git a/css/style.css b/css/style.css
index a4b2532..c82a181 100644
--- a/css/style.css
+++ b/css/style.css
@@ -351,6 +351,12 @@
margin-top: .1rem;
}
+.business-tips{
+ text-align: center;
+ margin-top: 20px;
+}
+
+
.navigation-btn {
justify-content: center;
align-items: center;
@@ -665,4 +671,30 @@
top: 50%;
z-index: 9;
transform: translate(-50%,-50%);
+}
+
+/* 导航弹窗 */
+.navigation-box{
+ width: 7.5rem;
+ height: 0;
+ border-radius: .3rem .3rem 0 0;
+ box-shadow: 0 0 .5rem rgba(0, 0, 0, .3);
+ position: fixed;
+ left: 50%;
+ bottom: 0;
+ z-index: 9999;
+ transform: translateX(-50%);
+ overflow: hidden;
+ transition: all .6s;
+}
+.navigation-box.show{
+ height: 3rem;
+}
+.navigation-box .item{
+ line-height: 1rem;
+ text-align: center;
+ border-bottom: .02rem solid #e1e1e1;
+}
+.navigation-box .item:last-child{
+ border: 0;
}
\ No newline at end of file
diff --git a/js/script.js b/js/script.js
index 82c6ebb..6242e97 100644
--- a/js/script.js
+++ b/js/script.js
@@ -41,6 +41,7 @@ jQuery(function($){
$('.result-tips').addClass('show');
},3000)
});
+
// 关闭弹窗
$('.tips-btn').click(function(){
turntableFlag = true;
@@ -53,21 +54,36 @@ jQuery(function($){
});
}
- // 立即导航
+ // 打开导航弹窗
if($('.navigation-btn').length){
// 打开弹窗
$('.navigation-btn').click(function(){
- // 百度地图(纬度，经度)
- window.open('http://api.map.baidu.com/marker?location=30.763954,104.098515&title=万圣家园B区&content=居民小区&output=html')
+ $('.pull-bg').addClass('show');
+ $('.navigation-box').addClass('show');
});
}
- // 详情页导航
- if($('.addr-item-btn').length){
- // 打开弹窗
- $('.addr-item-btn').click(function(){
- // 百度地图(纬度，经度)
- window.open('http://api.map.baidu.com/marker?location=30.763954,104.098515&title=万圣家园B区&content=居民小区&output=html')
+ // 开始导航
+ if($('.navigation-box').length){
+ // 腾讯地图
+ $('.tx-navigation').click(function(){ // (lng,lat)
+ window.open('https://apis.map.qq.com/uri/v1/marker?marker=coord:30.763954,104.098515;addr:万圣家园B区;&referer=webtest')
+ });
+ // 百度地图
+ $('.bd-navigation').click(function(){ // (lng,lat)
+ window.open('http://api.map.baidu.com/marker?location=30.763954,104.098515&title=万圣家园B区&output=html')
+ });
+ // 高德地图
+ $('.gd-navigation').click(function(){ // (lat,lng)
+ window.open('https://uri.amap.com/marker?position=104.098515,30.763954&name=万圣家园B区')
+ });
+ }
+
+ // 关闭导航弹窗
+ if($('.pull-bg-navigation').length){
+ $('.pull-bg-navigation').click(function(){
+ $('.pull-bg').removeClass('show');
+ $('.navigation-box').removeClass('show');
});
}
diff --git a/user/business.html b/user/business.html
index e230e4b..3c123c2 100644
--- a/user/business.html
+++ b/user/business.html
@@ -97,6 +97,15 @@
立即导航
+ ~ 下拉显示更多 ~
+
+
+
+
+
@@ -69,6 +69,14 @@
zoom:10
});
+
+
+
+