Twitter Bootstrap Karuzela za pomocą Joomla i jej Mootools

Question

Pracuję nad szablonem dla Joomla 2.5.x, używając Twitter Bootstrap. Chcę również użyć wtyczki Bootstrap Carousel dla tego szablonu.

Mam problem, gdy karuzela jest używana z implementacją Mootools Joomla. Styl elementu karuzeli zmienia się z ujemnym marginesem, przez co staje się niewidoczny dla użytkownika. Aby pokazać dokładnie, co się dzieje, przygotowałem dla ciebie jsfiddle http://jsfiddle.net/U2pHH/11/.

Karuzela powoduje, że co drugi obraz nie jest widoczny dla użytkownika z powodu atrybutu stylu zmiany karuzeli, ale użytkownik powinien zobaczyć każdy slajd.

Zajrzałem już do kodu źródłowego wtyczki Carousel Plugin i Mootools JS, ale niestety nie mogłem znaleźć przyczyny problemu. Myślałem, że może to jakiś problem z nazywaniem funkcji/klas między jQuery i Mootools, ale nie mogłem znaleźć tam żadnego problemu.

Mam nadzieję, że możesz mi pomóc tutaj.

Edycja: Odkryłem, że ma to coś wspólnego z klasą Fx.Slide z mootools-more.js, usunięcie klasy z kodu źródłowego rozwiązało problem. Ale to wciąż nie jest rozwiązanie, każda pomoc jest nadal bardzo doceniana.

Answer 1

Problem polega na tym, że Mootools więcej jest w konflikcie z twitter bootstrap, dlatego jego działanie jest dziwne w karuzeli. Proponuję użyć tylko jQuery lub po prostu Mootools. Istnieje implementacja Mootools do bootstrap: https://github.com/anutron/mootools-bootstrap

Answer 2

Mając ten sam problem. Używam wtyczki o nazwie JB Library (http://www.joomlabamboo.com/joomla-extensions/jb-library-plugin-a-free-joomla-jquery-plugin), która ma opcje usuwania Mootools i/lub Mootools More z poziomu administratora. Po wyłączeniu Mootools Problem z karuzelą jest "naprawiony". Może być łatwiejsze rozwiązanie niż komentowanie rzeczy w odniesieniu do aktualizacji. Chyba że potrzebujesz mootools-more.js do innych rzeczy na stronie oczywiście.

Mam nadzieję, że wkrótce pojawi się lepsze rozwiązanie.

Answer 3

Miał ten sam problem: karuzela Bootstrap nie działała w zarejestrowanym interfejsie, ponieważ załadowano plik mootools-more.js.

Moje rozwiązanie: Jquery Easy Plugin (http://www.simplifyyourweb.com/index.php/downloads/category/8-loading-jquery) z opcją "Remove Mootools when possible" w obszarze Advanced Options.

Answer 4

Oto dylemat specyficzne dla Joomla i mootools więcej,

dodać ten kod po wywołaniu JQ, to może być w żadnym js plik

dodać

if (typeof jQuery != 'undefined') { 
(function($) { 
     $(document).ready(function(){ 
     $('.carousel').each(function(index, element) { 
       $(this)[index].slide = null; 
       }); 
     }); 
})(jQuery); 
} 

Answer 5

Another realizacji tego samego rzeczą, którą dostarczył Benn jest

if (typeof jQuery != 'undefined' && typeof MooTools != 'undefined') { 
    Element.implement({ 
     slide: function(how, mode){ 
      return this; 
     } 
    }); 
} 

Co w końcu mi się udało - I utworzone niestandardoweMootools Więcej kompilacja bezFx.Przesuń

Answer 6

(function($) 
{ 
    $(document).ready(function(){ 
     var bootstrapLoaded = (typeof $().carousel == 'function'); 
     var mootoolsLoaded = (typeof MooTools != 'undefined'); 
     if (bootstrapLoaded && mootoolsLoaded) { 
      Element.implement({ 
       hide: function() { 
        return this; 
       }, 
       show: function (v) { 
        return this; 
       }, 
       slide: function (v) { 
        return this; 
       } 
      }); 
     } 
    }); 
})(jQuery);