خرائط Google مشكلة ارتفاع InfoWindow

Question

لقد كنت أبحث عن الشبكة عن حل.

مشكلتي هي أن ارتفاع نافذة المعلومات لا يتم حسابه بشكل صحيح. لا توجد صور هناك ، لذا فهي ليست مشكلة في تحميل الصورة لاحقًا ، ولا يُعرف الحجم عند إنشاء الفقاعة.

وأيضًا إذا قمت بملئه بحوالي 15 سطرًا ، فقد بدأ الحجم على ما يرام.

هذا ما أطعمه لـ InfoWindowhtml:

<div><h2><a href="">Some title</a></h2><dl><dt>Location:</dt><dd>london</dd><dt>Description</dt><dd><p>Example text </p></dd></dl><p><a href="">Read more...</a></p></div>

Answer 1

لحل هذه المشكلة ، يمكنك ضبط العرض وارتفاع Div الرئيسي. إذا قمت بتعيين العرض فقط ، فسوف يعمل. إذا قمت بتعيين العرض والارتفاع والتدفق: سيحصل أيضًا على شريط تمرير في حالة وجود محتوى طويل جدًا.

ولكن في خرائط Google v3 يتم حل هذه المشكلة.

Answer 2

واجهت نفس المشكلة ، لكنني اكتشفت أنني واجهت هذه المشكلة لأنني وضعت حشوة على .continfobubble في CSS ، ولا في معلمة الخيار. لذا، أقوم بإزالة الحشوة من CSS وقمت بتعيينها في المعلمة عندما أقوم بإنشاء الفقاعة في HTML (وليس .js بعد ولكن map.html), ، من هنا:

[...]
var ib = new InfoBubble({
   //minHeight: 125,
   minWidth: 220,
   padding: 7,
   borderColor: "#dedede",
   borderRadius: 3,
   pixelOffset: new google.maps.Size(-140, -110),
});
[...]

وحلت المشكلة. ربما لك أيضا.

Answer 3

أضف min-height إلى عنصر فئة InfoWindow الخاص بك.

سيؤدي ذلك إلى حل المشكلة إذا كانت InfoWindows الخاصة بك بنفس الحجم.

إذا لم يكن الأمر كذلك ، أضف هذا السطر من jQuery إلى وظيفة النقر لـ InfoWindow:

//remove overflow scrollbars
$('#myDiv').parent().css('overflow','');