Search code examples
javascriptjqueryjoomlamootools

ClearBox 3 jQuery.noConflict(); and/or javascript conflicts?

I've been trying to make this script from ClearBox3 to stop conflicting with MooTools.. But I can't seem to find a solution on google on how to do this.

Expected (Removed mootools library) - Displays Modal Window expected
(source: iforce.co.nz)

Actual (Joomla 2.5 Enviroment) - Redirects me to the image and does not display a modal window. actual
(source: iforce.co.nz)

So far I've ran the code jQuery.noConflict(); and I've swapped the function calls with $ with jQuery., But I'm being met with the error missing ( before formal parameters line 1.

Missing Formal
(source: iforce.co.nz)

Here is a modification of the script here.

Update: Unsure if its jquery conflicting.. due to implementing this fiddle (Thanks Joseph Silber) and new errors are occuring..

 Timestamp: 26/06/2012 3:22:34 p.m.
 Error: Event[cb[73]] is undefined
 Source File: http://localhost/components/com_autobase/js/clearbox/core/cb_core.js
 Line: 4

So the question is ... how can I stop the conflicting? between ClearBox3 and MooTools?

Solution

  • No need to replace all the $ symbols. Just create a closure:

    (function($) {
    // put all the code in here,
    // the $ will refer to the local variable containing jQuery
})( jQuery.noConflict() );

    Here's the fiddle: http://jsfiddle.net/v3qWN/