jquery conflicting with mootools and multiple js libraries

[dublin6]

Hi,
I am hoping someone can help me with two problems

The website I am developing can be found here

On the home page you can see I am using mootools for the image viewer on the lower right of the screen to get the "news" section to scroll through stories.

On the left side of the screen, there is a contact form in the side bar. I followed this tutorial to develop it. You can see that on all of the other page (where I do not need to use mootools) the contact form works correctly, but on the home page the scripts are conflicting.

I tried to follow this information to remedy the situation but was unsuccessful. I really need both the contact form and the image viewer functioning on the home page, is there any solution that may be available that I am missing?

The second problem is that now, because I implemented the contact form on pages that already were using js like here for the popout image viewer, I am now using a js library twice (js/jquery.js and ajax_contact_form/jquery-1.2.6.min.js, scripts are found in the "bottom" div of all the pages)

The problem is I am not sure how/where to change either the contact form script or the image viewer to work of the same js file. This isn't that big of an issue but would be nice to alleviate. The first issue, getting them to work together on the home page is huge, and I have no clue how to fix it.

Any help/advice would be much appreciated.
Thanks!

[fside]

Originally Posted by dublin6

Hi,
I am hoping someone can help me with two problems

The website I am developing can be found here

On the home page you can see I am using mootools for the image viewer on the lower right of the screen to get the "news" section to scroll through stories.

On the left side of the screen, there is a contact form in the side bar. I followed this tutorial to develop it. You can see that on all of the other page (where I do not need to use mootools) the contact form works correctly, but on the home page the scripts are conflicting.

I tried to follow this information to remedy the situation but was unsuccessful. I really need both the contact form and the image viewer functioning on the home page, is there any solution that may be available that I am missing?

The second problem is that now, because I implemented the contact form on pages that already were using js like here for the popout image viewer, I am now using a js library twice (js/jquery.js and ajax_contact_form/jquery-1.2.6.min.js, scripts are found in the "bottom" div of all the pages)

The problem is I am not sure how/where to change either the contact form script or the image viewer to work of the same js file. This isn't that big of an issue but would be nice to alleviate. The first issue, getting them to work together on the home page is huge, and I have no clue how to fix it.

Any help/advice would be much appreciated.
Thanks!

There's a forum here called, Javascript Frameworks. Yes - I know - jQuery and MooTools are libraries, not frameworks. But that's the title.

jQuery is known for being able to get out of the way. It uses mutiple 'namespaces' and has a noconflict method, I believe it is. Maybe you misunderstood the documentation. I take it that you're trying to say that the $ has gone awry, or something. Load jQuery first, other scripts you load will overwrite. One of the other 'namespaces' for jQuery - IS . . . "jQuery". Try that. It's what I do. I have my own $ function.

[dublin6]

Solved, thanks