joomla template breaks when we add drop down menu

Hello,

We created a javascript drop down menu (select country) which uses jquery, for some reason when we drop it into our joomla template via a custom HTM module it breaks.

We recieve the following errors from IE however we cant figue out what is happening.

Message: 'this.$events[...].keys' is null or not an object
Line: 47
Char: 978
Code: 0
URI: http://www.mazero.com/media/system/js/mootools.js


Message: Object doesn't support this property or method
Line: 73
Char: 1
Code: 0
URI: http://www.mazero.com/media/system/js/caption.js


Message: 'null' is null or not an object
Line: 12
Char: 2
Code: 0
URI: http://www.mazero.com/index.php

Please see http://www.mazero.com/index.php (select country menu top right position).

Any help or suggestions greatly appreciated.
PlumInternetAsked:
Who is Participating?
 
kadabaConnect With a Mentor Commented:
you have to include this after the jquery js has been loaded it will at least remove those errors.

<script type="text/javascript">
jQuery.noConflict();
jQuery(document).ready(function()
{
	jQuery('#country_menu').clickMenu({arrowSrc:''}); 
});
</script>

Open in new window

0
 
kadabaCommented:
since you are using both mootools and jquery there will be a conflict for the $, since you have added jquery recently into the module use the noconflict function which will free the $ for mootools usage..

http://api.jquery.com/jQuery.noConflict/

try and see if this solves the problem
0
 
PlumInternetAuthor Commented:
We gave it ago with no luck.
0
Never miss a deadline with monday.com

The revolutionary project management tool is here!   Plan visually with a single glance and make sure your projects get done.

 
kadabaCommented:
I was able to get rid of the errors, I just tried... check the attached file. I am not sure about the mootools error though.

mazero.html
0
 
PlumInternetAuthor Commented:
Hey Kadaba,

That has resolved the errors however the menu drop down doesnt fold up.

Thanks
0
 
kadabaCommented:
the menu is proper but hiding behind the search... try putting the menu (just for testing) somewhere else on the page. say near the client login and check
0
 
PlumInternetAuthor Commented:
We have moved it to the logo position but with no luck
0
 
kadabaCommented:
I was actually checking in FF and it works... even the file which i sent last, i changed the position of the menu and it worked... So there must be something which is pranky.. I ll have a look at it bit later.. or you can open a new question for that ans see if any one comments.. keep this open until its fixed.
0
 
Vimal DMCommented:
Hai,

I too had an experience with design when using "mootools.js".

I suggest you not to go for "mootools.js" source,kindly refer some other jquery file to implement your functionality.

mootools.js - contains default setting,names and tags which will affect the our way of doing design issues.

Thanks
0
 
PlumInternetAuthor Commented:
This partially resolved the issue, there was also problems with the CSS.
0
All Courses

From novice to tech pro — start learning today.