Question

我不确定为什么滚动到地图功能不起作用。我正在使用滚动动画

点击它应该滚动到地图

请看看我的jsfiddle，它相当紧张。

JS：

var scrollToLondon = $("a.London");
var getLondon = new google.maps.LatLng('51.515502', '-0.078345');
var slideMap = $('#map-canvas');
var body = $("#map-canvas");
slideMap.addClass('close');


function initializeLondon() {
    var mapOptions = {
        zoom: 18,
        center: getLondon,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    }

    var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

    var contentString = '<address class="address">address goes here</address>';

    var infowindow = new google.maps.InfoWindow({
        content: contentString
    });
    var image = 'assets/images/marker-red.png';
    var marker = new google.maps.Marker({
        position: getLondon,
        map: map,
        title: 'London',
        icon: image
    });
    google.maps.event.addListener(marker, 'click', function () {
        infowindow.open(map, marker);
    });
    infowindow.open(map, marker);
}

var myDiv = document.getElementById("London");
google.maps.event.addDomListener(myDiv, "click", function () {

    initializeLondon();
    google.maps.event.addDomListener(window, 'load', initializeLondon);


    slideMap.removeClass('close');
    body.animate({
        scrollTop: 0
    }, 800);
    return false;
});

Answer 1

<强> Working Demo

尝试使用

$('html, body').animate({ scrollTop: 800 }, "slow");

现在你的伦敦点击功能就像

$('#London').on("click", function (e) {
    e.preventDefault();
    initializeLondon();
    $('html, body').animate({ scrollTop: 800 }, "slow"); 
    return false;
    google.maps.event.addDomListener(window, 'load', initializeLondon);

});

单击显示地图，然后滚动到地图

1 个答案: