Почему полоса прокрутки появляется в моем окне карт в Chrome? - PullRequest
11 голосов
/ 14 октября 2011

Вот код JavaScript:

$(document).ready(function(){

//set location of san antonio 
var san_antonio = new google.maps.LatLng(29.4, -98.544);

//set infowindow
var infoWindow;

//object literal containing the properties
var options = {
  zoom: 9,
  center: san_antonio,
  mapTypeId: google.maps.MapTypeId.ROADMAP 
}

//create the map
var map = new google.maps.Map(document.getElementById('map'), options);

//create marker
var marker = new google.maps.Marker({
  position: san_antonio,
  map:map,
  title: "san antonio"
});


//add 'click' event listener
google.maps.event.addListener(marker, 'click', function(){

//creates infowindow if it already doesn't exist
if (!infoWindow){
  infoWindow = new google.maps.InfoWindow();
}

//create content for infowindow
var content = '<div id="information">'+'<img src="http://a1.twimg.com/profile_images/1549555880/Screenshot.png"/>'+'</div>'

//set content of the infowindow. 
infoWindow.setContent(content);

//open infowindow on click of marker 
infoWindow.open(map,marker);

//ends the event listener
}); 


//ends the DOM loader
});

В Chrome я получаю ненужную полосу прокрутки в информационном окне, когда она появляется.Если вы посмотрите на правый нижний угол, то заметите, что есть и небольшое искажение.

В Chrome

my infowindow rendering in chrome

Информационное окно выглядит великолепно вFire Fox.У меня не было этой проблемы прошлой ночью, когда я работал на своем рабочем столе, поэтому я думаю, что моя установка Chrome может быть нарушена на моем ноутбуке.Как вы думаете?Вот как это выглядит в FireFox:

В FireFox

einfowindow rendering in firefox

Я пытался сделать div#information{overflow:hidden}, но ничего не изменилось, затем я попытался сделать div#information{overflow:hidden;height:500px;background-color:green;},а затем полоса прокрутки стала еще длиннее.Это говорит мне о том, что информационное окно действует как собственный div и что высота информационного div вызывает увеличение полосы прокрутки информационного окна.enter image description here


Ответы [ 4 ]

5 голосов
/ 07 ноября 2013
.gm-style-iw{ overflow: hidden !important;}

у меня работает

5 голосов
/ 14 октября 2011

Попробуйте добавить этот стиль CSS:

div#information{
    overflow: hidden;
}
3 голосов
/ 06 февраля 2014

Это решение работало для меня:

line-height:1.35;
overflow:hidden;
white-space:nowrap;
2 голосов
/ 22 августа 2013

может быть проблема с высотой строки. это то, что вызывало ошибку для меня. см. Google Maps API v3: размер окна InfoWindow неверен ответ # 11125793 (Ник).

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...