feat: change fullscreen to web full

libmw · libmw · commit fcbb959ffd48 · 2023-11-03T17:00:16.000+08:00
diff --git a/_posts/2021-11-17-picture-gps.md b/_posts/2021-11-17-picture-gps.md
@@ -26,7 +26,11 @@
     flex: 1;
   }
 
-  .fullscreen{
+  .map-ctn{
+    height:100%;
+  }
+
+  .fullscreen-btn{
     position: absolute;
     z-index: 1;
     color: #e6e6e6;
@@ -78,15 +82,24 @@
       display: block;
     }
   }
+  .fullscreen{
+    position: fixed;
+    top:0;
+    left:0;
+    right:0;
+    bottom:0;
+  }
 </style>
 <script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=05fb23d2c6d3ce6323793cd981030e9f&plugin=AMap.Geocoder"></script>
 <script src="/resource/2018/exif.js"></script>
 <script src="/resource/2021/gpsConvert.js"></script>
 
 <div class="gps-container">
   <h2>把图片拖进来</h2>
-  <div class="container" id="mapCtn">
-    <div class="fullscreen">全屏</div>
+  <div class="container">
+    <div class="map-ctn" id="mapCtn">
+      <div class="fullscreen-btn">全屏</div>
+    </div>
   </div>
   <div id="makeAndModel" style="height: 30px; "></div>
   <footer>
diff --git a/resource/2021/1117_gps.js b/resource/2021/1117_gps.js
@@ -15,11 +15,13 @@ function gps2Google(gpsCoord) {
 var pageControl = {
   init: function () {
     const mapContainer = $("#mapCtn");
-    const fullBtn = $(".fullscreen");
+    const fullBtn = $(".fullscreen-btn");
     const btnAmapTile = $("#btnAmapTile");
     const btnGoogleTile = $("#btnGoogleTile");
 
     fullBtn.addEventListener("click", () => {
+      $(".container").classList.toggle("fullscreen");
+      return;
       if (document.fullscreenElement) {
         document.exitFullscreen();
         return;
@@ -36,7 +38,7 @@ var pageControl = {
         "http://mt2.google.com/vt/lyrs=y&hl=zh-CN&gl=cn&x=[x]&y=[y]&z=[z]&s=Galil",
       zIndex: 3,
     });
-    this.googleLayer=googleLayer;
+    this.googleLayer = googleLayer;
 
     const amapSatelliteLayer = new AMap.TileLayer.Satellite();
     const amapRoadNetLayer = new AMap.TileLayer.RoadNet();
@@ -45,7 +47,6 @@ var pageControl = {
       resizeEnable: true,
       zoom: 15,
       center: [116.397428, 39.90923],
-      
     });
 
     const testGoogleImage = new Image();
