Проблеми при використанні LightBox та деяких інших скриптів

26 April, 2011

При використанні бібліотеки FullAjax можна зіткнутись з тим, що інші скрипти (наприклад LightBox) відмовляються працювати, або працюють не коректно. Причина з якої вони відмовляються працювати дуже проста – вони не зовсім розраховані на сумісну роботу з AJAX.

Як це можна поправити, опишу в декількох рядках нижче…

Основна причина (але не єдина) по якій деякі скрипти відмовляються працювати сумісно з AJAX – це те, що вони не “бачать” коли AJAX сторінка завантажена та готова до “використання”. Щоб це поправити потрібно самостійно їм вказувати, що сторінка “готова”.

Для цього, після завантаження AJAX сторінки потрібно повідомити скриптам, що сторінку оновлено.
Щоб визначити коли сторінка готова, можна скористатись подією “load” бібліотеки FullAJAX (приклад для Mootools fireEvent()):

FLAX.Html.onall('load', function(options){
	window.fireEvent('domready');
});

або функцією зворотного виклику:

function doSomethingAfterFAjxPagLoad (){
	window.fireEvent('domready');
};

Щоб ця функція спрацювала після завантаження AJAX сторінки, в базові налаштування бібліотеки FullAjax потрібно додати параметр onload:doSomethingAfterFAjxPagLoad .
Приклад :

FLAX.Filter.add({url:'/', id:fullAjaxId, onload:doSomethingAfterFAjxPagLoad}); 
...
function doSomethingAfterFAjxPagLoad (){
/* fix for mootools 'domready', uncomment if need*/
/*	window.fireEvent('domready');  */
};

При використанні window.fireEvent(‘domready’); потрібно бути обережним.
По перше це допомагає лише якщо скрипт дійсно не “бачить”, що сторінка “готова”.
По друге, при сумісному використанні з іншими скриптами які нормально працюють з AJAX – це може призвести, до додаткових не бажаних помилок, таких як подвійне виконання цього скрипта. Тому в плагіні ця функція за замовчуванням закоментована.

В деяких випадках потрібно використовувати window.fireEvent(‘load’); – все залежить від самого скрипта який “відмовляється” працювати.

Взагалі, якщо “неробочий” (наприклад LightBox) скрипт потрібен лише на певній сторінці, то вище вказану функцію краще виконувати саме на цій сторінці, а не на кожній. Це попередить виникнення додаткових помилок.
Приклад для сторінки “Галерея” ( mysite.com/galery ):

if(location.toString().indexOf('/galery') != -1){
	window.fireEvent('domready'); 
}

Далі буде, можливо… :)

Posted in FullAjax, Як це (інструкції) Comments (91)
Позначки:, , ,

91s коментарів to “ Проблеми при використанні LightBox та деяких інших скриптів ”

← Older Comments
Newer Comments →
  1. Thomas коментує:
    19.12.2011 о 13:29

    Hi,
    and thanks for that great plugin.

    Unfortunately i cant get it to work with Simple Image Gallery. The milkbox/Lightbox doesnt open anymore. Already tried hints from above on this page. But it wont do.

    Thanks for your help,

    Thomas

    Відповіcти
    • Fedik коментує:
      19.12.2011 о 22:00

      these hints for mootools based scripts … for jQuery and others should be also something :)
      you need find how works gallery initialisation, and add the initialisation code in to a “doSomethingAfterFAjxPagLoad” function:

      function doSomethingAfterFAjxPagLoad (){
   // here is some code for gallery initialisation
};
      Відповіcти
  2. André коментує:
    19.12.2011 о 22:57

    First of all thank you for this great plugin.
    My problem appears when I turn on in the joomla search engine friendly URLs.
    I get the error 303 See Other.
    How can I get a complete component, in this case JoomGallery exclude?
    I hope to find help here.

    Greetings from Germany

    Відповіcти
  3. Thomas коментує:
    20.12.2011 о 13:10

    Thanks so much. I had to add
    milkbox = new Milkbox({ centered:true }); in “doSomethingAfterFAjxPagLoad”
    as well as loading milkbox.js manually (not by gallery plugin).

    It finally works. great job! Thanks Fedik!!!

    Відповіcти
  4. André коментує:
    20.12.2011 о 21:16

    Hi Fedik, it is not your great plugin.
    This is a problem of the JoomGallery. Once the Joomla SEF is activated from the galley returns error 303. That seems to come from the router.php. If I do not get the point I’m going to use one other gallery. All other works fine. The only problem that remains for me, I get the slimbox not to run and have always in the URL: # ajx / How can I remove it?
    I have all tested here described, unfortunately without success.
    In any case thank you for your help and your great plugin.

    Відповіcти
    • André коментує:
      20.12.2011 о 23:01

      Hier is a link to see it in action : http://wgf.stahlsite.de/
      It is only a testpage, but should go online soon on a other URL. SEF is activated for the time.
      The Joomla Version 1.5.23 an the the JoomGallery is Version 1.5.7.4

      greets André

      Відповіcти
    • Fedik коментує:
      21.12.2011 о 16:53

      no, you cannot remove #ajx .. ‘#’ – need for fullajax works, but you can change text, in the plugin configuration find next

      SRAX.linkEqual['!ax!'+fullAjaxId+'!'] = ‘ajx’;

      and change ‘ajx’.

      Відповіcти
  5. luke коментує:
    11.02.2012 о 12:39

    Hi Fedik! Many thanks for this awsome plugin :)

    I’ve got one problem with Simple Image Gallery plugin with FullAjax plugin enabled. If in article is gallery I can’t get into full text from blog view. Popup engine I’m using is Slimbox(mootols) also I have default Joomla simple URL’s running on my site and in plugin configuration enabled this piece of code:
    function doSomethingAfterFAjxPagLoad (){
    window.fireEvent('domready');
    };

    Please help. I’m not very familiar with ajax :(

    Відповіcти
  6. Олег коментує:
    03.03.2012 о 13:48

    Пытаюсь настроить FullAjax с LightBox.
    Вписал в настройки
    FLAX.Filter.add({url:’/’, id:fullAjaxId, onload:doSomethingAfterFAjxPagLoad});
    …..
    function doSomethingAfterFAjxPagLoad () {
    window.fireEvent(‘domready’);
    };
    (Вернее оно уже было вписано, я просто раскомментировал)
    И оно никак не хочет работать. Может я что неправильно вписал. или надо в index.php шаблона что-то вписать.
    вписываю FLAX.Filter.add({url:’/folder-myimgs/’, type:’nowrap’}) картинка открывается прямо в окне без LightBox.
    Очень понравилась ваша библиотека. Хотелось бы использовать
    Помогите, пожалуйста!

    Відповіcти
    • Fedik коментує:
      03.03.2012 о 21:50

      Який плагін для LightBox використовуєте?

      пс. Бібліотека насправді не моя, я лише зробив плагін ;)

      Відповіcти
      • Олег коментує:
        04.03.2012 о 10:06

        JoomShopping, там стандартный LightBox, версия Joomla – 2.5
        canauto_точка_com.ua можно глянуть

      • Fedik коментує:
        04.03.2012 о 17:35

        для jquery.lightbox-0.5.pack можна спробувати ще так:
        додайте папку з зображеннями у фільтр :

        FLAX.Filter.add({url:['/img_products/'],  type:'nowrap'});

        а потім:

        function doSomethingAfterFAjxPagLoad () {
    jQuery("a.lightbox").lightBox({
                    imageLoading: "http://canauto.com.ua/components/com_jshopping/images/loading.gif",
                    imageBtnClose: "http://canauto.com.ua/components/com_jshopping/images/close.gif",
                    imageBtnPrev: "http://canauto.com.ua/components/com_jshopping/images/prev.gif",
                    imageBtnNext: "http://canauto.com.ua/components/com_jshopping/images/next.gif",
                    imageBlank: "http://canauto.com.ua/components/com_jshopping/images/blank.gif",
                    txtImage: "Изображение",
                    txtOf: "из"
                });
  window.fireEvent('domready');
};
      • Олег коментує:
        04.03.2012 о 11:36

        Попробовал установить FancyBox – то же самое.
        Зато заметил, если загрузить страницу первый раз – все хорошо работает, после навигации по страницам перестает

      • Fedik коментує:
        04.03.2012 о 13:56

        чесно кажучи навіть не знаю, що порадити, для FancyBox можна спробувати додати jQuery.fancybox.init();
        а initJSlightBox(); викликає лише помилку, так як функції не знайдено

      • Олег коментує:
        10.03.2012 о 17:09

        Поковыряв это дело, нашел решение. Оказывается Ваш плагин не подгружает javascript файлы. Подключив библиотеки jquery и fancybox в хедер шаблона (так чтобы они подгружались на всех страницах) и убрав оттуда, где им место, все начало отлично работать. Но я так понимаю, что это некорректный выход из ситуации. Можно ли будет этого избежать в следующей версии плагина?

      • Fedik коментує:
        10.03.2012 о 19:11

        FullAjax завантажує скрипт лише один раз та кешує його, далі використовується кеш…
        Проблема в тому, що кожне розширення галереї чи іншої подібної біди, має власну ініціалізацію – це просто не реально передбачити/відгадати/зробити універсальним.
        Єдиний шанс, це якщо в Joomla приймуть “standart for JavaScript initialisation in Joomla!”

  7. Gerix коментує:
    20.03.2012 о 09:53

    Hi. Great plugin. But I have some problems with vertical menu, I edit template index.php, after that it gets work. Only menu have some problems, pleease look.

    Відповіcти
    • Fedik коментує:
      20.03.2012 о 11:40

      ‘Auto check’ for you menu not work because you have not default menu code, there need own script for it. If you know JavaScript try add class “active” by “click” event

      Відповіcти
  8. Tom коментує:
    20.03.2012 о 12:37

    Hello

    Great extension – thank you!

    I will to use fullajax for a site. On this site i have a few modules (custom_mod) with image gallerys. i use Joomla! (2.5.3) JCE Shadowbox plugin. But it do not work. The pictures are open in a new browser window, not in a lightbox.

    i have read the instruction above, but it still do not work. I don’t understand it.

    Please help ;-)

    Tom

    Відповіcти
← Older Comments
Newer Comments →

Напишіть відгук

Ваша пошт@ не публікуватиметься. Обов’язкові поля позначені *

Можна використовувати XHTML теґи та атрибути: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>