Блог

У меня возникли проблемы с интеграцией плагина Galleria image gallery на одну из моих вкладок Jquerytools. При переходе непосредственно на страницу с галереей (пример: www.domain.com/index.php#tabnameofgalleriapane ), нет никаких проблем.

Всякий раз, когда панель с галереей не загружается немедленно (панель по умолчанию — другая панель), Gallery выдает ошибку: Fatal error: Could not extract a stage height from the CSS. Traced height: 0px. , что логично, потому что, когда панель Galleria не активна, это, вероятно, css display:none; …

Определение высоты и ширины буквально, похоже, не работает. Это была предыдущая настройка:

 jQuery("#jp_nav").tabs(".jp_pane", { history: true } );
jQuery('#gallery').galleria({
    imageCrop: false,
    transition: 'slide',
    autoplay: 7000,
    width: 960,
    height: 640
});
  

Итак, я подумал привязать загрузку плагина Galleria к загрузке панели, содержащей плагин Galleria, потому что в этот момент панель Galleria имеет высоту… Я нашел кое-что, что поможет мне на моем пути, но теперь я получаю другие ошибки конфликта JavaScript (см. Объяснение Ниже).

 jQuery("#jp_nav").tabs(".jp_pane", {
  initialIndex: 0,
  onBeforeClick: function(event, i) {
    // get the pane to be opened
    var pane = this.getPanes().eq(i);
    var src = this.getTabs().eq(i).attr("href");
    pane.load(src, "#jp_images", function(){
        jQuery('#gallery').galleria({
            imageCrop: false,
            transition: 'slide',
            autoplay: 7000,
            width: 960,
            height: 640
        });  
    });
  },
  history: true
});
  

По независящим от меня причинам веб-сайт, для которого я это пишу, использует как jQuery, так и Prototype / Scriptaculous. Поэтому, пожалуйста, примите во внимание, что скрипт должен быть написан в режиме noConflict. (Что я делаю в своей настройке $.noConflict(); )

Может кто-нибудь, пожалуйста, скажите мне, указывает ли приведенный ниже сценарий на правильный путь? Может ли кто-нибудь помочь мне изменить сценарий, чтобы он работал при загрузке вкладки #jp_images? Прямо сейчас приведенный выше скрипт выдает мне ошибки конфликта с Prototype.

С нетерпением ждем ваших экспертных мнений!

С уважением,

Maarten

Мне удалось найти быстрое и грязное решение (благодаря vfxdude)

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

 tabName = 'jp_images';
jQuery('#jp_nav a[href="#' tabName '"]').click(function() { if (location.hash == '') location.replace(location.href '/#' tabName); });
  

После этого я могу просто использовать обычную инициализацию плагина старой галереи.

Конечно, это немного грязно, но это простое и быстрое решение, когда сроки поджимают.