Карта Google в стиле Yelp, которая следует за пользователем вверх и вниз по странице - PullRequest
1 голос
/ 19 августа 2011

Я бы хотел, чтобы на моей странице была карта Google в отдельной колонке, которая будет скользить вверх и вниз в соответствии с высотой прокрутки окна браузера. Я видел эту функциональность на нескольких сайтах (вскрикивает). Кто-нибудь знает хороший плагин jQuery, который реализует эту функциональность? Я даже не уверен, как искать такой плагин, потому что я не совсем уверен, как его назвать.

Редактировать: используя решение Аллеи, я пришел к этому как окончательный ответ:

    $(function() {
        $(window).scroll(function() {
            var $map = $('#mymap');
            var locMin = 0;
            var locMax = $map.parent().height() - $map.height()
            var dif = $(window).height() / 2 - $map.height() / 2;
            var loc = dif + $(window).scrollTop() - $map.parent().offset().top;
            if (loc > locMax)
                loc = locMax;
            if (loc < locMin)
                loc = locMin;
            $map.css('top', loc);

        })

убедитесь, что вы используете CSS, чтобы элемент #mymap был position: relative.

1 Ответ

1 голос
/ 19 августа 2011

Просто написал один быстро для вас:

$(function() {
$(window).scroll(function() {
  if($('#map').offset().top <= 0) {
    $('#map').css({ position: 'fixed', top: 0, left: '50%', 'margin-left': YOUR PAGE WIDTH / 2 - $('#map').width() })
  } else {
    $('#map').css({ position: 'relative', top: 'auto', left: 'auto', margin:0 })    
  }
})
})
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...