Conflict with jquery

I am expanding into jquery and finding items of interest. However, my test jquery pages do not play well with powergallery which is using mootools... another designer said


You are combining different libraries: mootools and jquery.

That is likely to lead to conflicts.

So, as i try to move towards more jquery, what should I do with older powergallery scripts?

Assistance most appreciated.. note that I am a totally newbie with jquery, but intend to focus here for future development...

thank you

jQuery has a jQuery.noConflict() mode that can be used when loading other libraries, you can find more info on the jQuery site here

thank you... I'll check it out

As long as you have the latest PowerGallery 1.1, mootools and jQuery should be able to co-exist. The main conflict is the $() function, but as of 1.1, PowerGallery uses document.id() from mootools so there shouldn't be any conflicts between the two. What specific errors are you getting?

-justin

This is one of my earlier installs, so perhaps I didn't upgrade to last version. How can I determine which version this site is using?

The error is when a click on an image for enlargement... it is opening in a new page instead of going to a lightbox effect.

Thanks.

Comparing this install to a newer one, I see less galleries, so I am assuming it is the older one. Upgrading now. Thanks for that suggestion.

Thank you. Upgrade fixed it.

Awesome. Version 1.1 has all the additional slideshows like you said, so that is an easy way to determine if you have the latest. If you're interested, here is a post I wrote explaining about the $() and document.id() to make MooTools and jQuery work happily. use-document-id-with-mootools-jquery/

-justin

I just upgraded to 1.1.1 but am still having a conflict when I call jquery and other scripts...The arrows on the powergallery ribbon now sit above and below the ribbon, and when you click on the photos, they just open the image in the browser window.

I reviewed the link provided here about the no conflict function...but I'm not too good with javascript, so I'm not sure what can be done about it.

The site I'm working on is nieuport17.com (it's a wp site)

The scripts I'm trying to call are the following:
/*
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/scripts/iweb.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/scripts/jquery-1.4.2.min.js"></script>
<script>
$(document).ready(function(){

//Code for link Toggle
$(".menuitem").click(function(e){$(e.target).next("p").toggle("slow"); });

//Code for showall
$(".showall").click(function(){$("div.menudesc").find(".hidden").show("slow"); });

});
</script>
*/

Can someone help?

Going to the link you sent, it looks like you are trying to run some jQuery code before you have the jQuery include on the page. This doesn't look like a conflict with PowerGallery. If you are running 1.1.1, then it already has the fixes to allow both libraries to co-exist.

I would recommend using Firebug for Firefox or the Chrome dev tools to troubleshoot your issue. The JavaScript console will tell you exactly where the error is occurring.

-justin