एनीमेशन

Question

के बाद Google मानचित्र कंटेनर ठीक से आकार बदलता नहीं है मेरे पास एक Google मानचित्र कंटेनर है, मान लें 600px ऊंचाई।

मैं एक बटन है, आकार बदलने (jQuery) मानचित्र arround div कंटेनर:

  $('#add').click(function() { 
       $("#container-map").animate({ 
        height: '50%', 
        minHeight: '50%' 
       }, 1500); 
       google.maps.event.trigger(map, 'resize'); 
      }); 

अब कंटेनर और नक्शा 300px ऊंचाई के हैं, लेकिन गूगल मैप्स एपीआई सोचता है कि यह अभी भी 600 पिक्सेल है, तो मानचित्र का केंद्र अभी भी 300 पीएक्स पर है हालांकि यह 150 पीएक्स (300/2) पर होना चाहिए।

http://woisteinebank.de/dev2.html# जब आप बॉक्स में किसी स्थान की खोज करते हैं, तो यह केंद्रित हो रहा है। "Eintragen" दबाएं और फिर से खोजें, यह ठीक से केंद्रित नहीं है।

क्या आप इस दोष को ठीक करने का प्रयास कर सकते हैं या सत्यापित कर सकते हैं या सुझाव भी दे सकते हैं?

मैं usual solution with triggering the resize event का उपयोग करने की कोशिश की लेकिन यह

Answer 1

हा हा काम नहीं करता है क्योंकि आप आकार बदलने घटना से पहले एनीमेशन भी शुरू होता है :-) आप जब तक यह समाप्त हो जाती है इंतज़ार करना ट्रिगर। इस के लिए, the 4th argument of .animate का उपयोग करें - complete कॉलबैक जो एनीमेशन के बाद कहा जाता है समाप्त होता है:

$('#add').click(function() { 
    $("#container-map").animate({ 
     height: '50%', 
     minHeight: '50%' 
    }, 1500, function() { 
      google.maps.event.trigger(map, 'resize'); 
    }); 
});