如何解决谷歌地图与其他jQuery插件的冲突?

时间:2015-07-30 19:41:12

标签: javascript jquery wordpress google-maps

我正在构建wordpress网站,我使用此代码添加了Google地图

<script type='text/javascript' src='http://maps.googleapis.com/maps/api/js?sensor=false&#038;v=3.exp'></script>
<script type='text/javascript' src='http://sabastudios.com/ext/responsive-maps-plugin/includes/js/jquery.gmap.min.js?ver=3.3.3'></script>
    <script type="text/javascript">
    jQuery(document).ready(function($) {
    var mapdiv = jQuery("#responsive_map_1932889777");
    mapdiv.gMapResp({
      maptype: google.maps.MapTypeId.ROADMAP,
      zoom: 17,
      markers: [{
                    address: '1 Hermann Park Ct #634 Houston, Texas 77021', 
                    html:'<img src=\'http://motiongiraffx.com/wp-content/uploads/2015/07/marker.png\' width=\'100px\'><br><br /> 1 Hermann Park Ct #634 <br/>Houston, Texas 77021',
                    popup: true,
                    flat: true,
                    icon: {    
                        iconsize: [100, 75],
                        iconanchor: null,
                        shadowsize: [50, 50],
                        shadowanchor: null}}],
      panControl: false,
      zoomControl: true,
      draggable: true,
      scrollwheel: true,
      mapTypeControl: false,
      scaleControl: false,
      streetViewControl: false,
      overviewMapControl: true,
      latitude: null,
      longitude: null     });
  });
    window.onresize = function() {
        jQuery('.responsive-map').each(function(i, obj) {
            var gmap = jQuery(this).data('gmap').gmap;
            google.maps.event.trigger(gmap, 'resize');
            jQuery(this).gMapResp('fixAfterResize');
        });
  };
    </script>
  <div id="responsive_map_1932889777" class="responsive-map" style="height:450px;width:100%;"></div>

但是当我添加任何其他jQuery插件时,我得到了地图的错误,无法读取未定义的属性'gmap'。我认为存在冲突,但我不知道如何解决它。

例如,我想添加这两个插件

http://www.web2feel.com/freeby/scroll-effects/ http://git.blivesta.com/animsition/fade-down/

在WordPress或插件之间解决这些冲突的最佳方法是什么?

0 个答案:

没有答案