Вызов внешнего файла .js после изменения свойства CSS элемента

Question

У меня была та же проблема, что и упомянутая здесь, со встроенной Картой Google, смещенной , и не очень разбирающейся в javascript, я не знаю, как решить эту проблему идеальным способом.

Я использую библиотеку jQuery Tools для создания своего рода «мастера» для моих пользователей, как показано здесь: http://flowplayer.org/tools/demos/tabs/wizard.html

На одной из панелей мастера есть встроенныйGoogle Map.На карте есть проблема, упомянутая в ОП.

Чтобы предотвратить первоначальное отображение всех панелей мастера, пока их не скрывает скрипт jQuery Tools, я дал панелям свойство CSS "display: none"(кроме первой панели).Это коренная причина проблемы - комментирование этой строки в CSS приводит к тому, что панели на мгновение становятся видимыми, а встроенная карта Google работает правильно.

Мой вопрос прост : какя бы отобразил следующий псевдо-jQuery-код в правильном jQuery / javascript?

when (.pane.hasMap).css("display") == "block"
{
    load/run external google-maps.js file
}

Кроме того, мне нужно было бы запускать его каждый раз, когда пользователь переключается на панель с картой, или только в первый раз?

РЕДАКТИРОВАТЬ:

Гах ... Я только что обнаружил, что плагин Google Maps для моей CMS автоматически вставляет скрипт на страницу выше, где я был вручную (и с избыточностью, какоказывается) с указанием сценария.Таким образом, я не могу контролировать, когда вызывается скрипт и отображается карта.

Итак, единственная альтернатива, о которой я могу подумать, - это поместить контейнер карты вне экрана, а затем восстановить его обратно.на место, когда вызывается вкладка.Может быть, что-то вроде этого ?:

if ( $(".pane.hasMap").is(':visible') ) {
    $(".mapContainer").css("top", "0", "left", "0");
}

Answer 1

Что-то сделать, если что-то видно:

if ( $(".pane.hasMap").is(':visible') ) {
    $.getScript("https://apis.google.com/js/google-maps.js", function () {
          //execute maps here;
    });
}

Если вы используете jQuery для отображения скрытых элементов, вероятно, лучше получить скрипт одновременно с отображением этих элементов, например:

$(".pane.hasMap").show('slow', function() {
    $.getScript("https://apis.google.com/js/google-maps.js", function () {
          //execute maps here;
    });
});