Question

我有一个我在js文件中使用的图像（它用于地理定位图标），我想添加CSS样式，因为图像本身在屏幕上太大了。

<!DOCTYPE html>
<html>
  <head>
    <style>
        html, body {
            height: 100%;
            margin: 0;
            padding: 0;
            overflow: hidden;
        }

        #map {
            height: 100%;
        }
    </style>
  </head>
  <body>
    <div id="map"></div>
    <script>
        var locationIcon = 'img/SVG/User_Location.svg';

        // Try HTML5 geolocation.
        if (navigator.geolocation) {
          navigator.geolocation.getCurrentPosition(function(position) {
          var pos = {
            lat: position.coords.latitude,
            lng: position.coords.longitude
          };

          //Centers map to current position  
          map.setCenter(pos);

          //Sets icon to current position
          var currentLocation = new google.maps.Marker({
            position: {lat: position.coords.latitude, lng: position.coords.longitude},
            map: map,
            icon: locationIcon
          });

        }, function() {
          handleLocationError(true, infoWindow, map.getCenter());
        });
      } else {
        // Browser doesn't support Geolocation
        handleLocationError(false, infoWindow, map.getCenter());
      }
    }    
    </script>
  </body>
</html>

我将如何实现这一目标？编辑：我添加了代码来显示图像的显示方式

Answer 1

我认为你要找的是这篇文章的答案。 How to display image with javascript?您希望自己的图像位于.js文件之外。您可以在链接解决方案的功能中添加一个类，该类将使用该元素创建该类。从那里你可以通过

选择班级

.custom-class {
    width: 100%;
    height: 100%;
    etc...
}

将CSS样式添加到Javascript中使用的图像

1 个答案: