I have these 2 conflicting javascripts… can't find the solution

Question

I'm using a slideshow plugin and a navigation plugin... Here's all the javascripts I call in the header :

<script type="text/javascript" src="/jquery-1.2.3.min.js"></script>
<script type="text/javascript" src="/jquery.easing.min.js"></script>
<script type="text/javascript" src="/jquery.lavalamp.min.js"></script>
<script type="text/javascript">
$(function() { $(".nav").nav({ fx: "backout", speed: 600 })});
</script>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="Slider.js"></script>

<script type="text/javascript">
$(document).ready(function() {
    $('#slider').Slider({
        timeOut: 4500
    });
});
</script>

When I put the slideshow in, the slide navigation didn't work anymore.. I'm not sure how to combine the two!

Thanks in advance.

Answer 1

You have multiple DIFFERENT versions of jQuery. You cannot do that and expect good results. You need to pick only one version of jQuery and use just that.

You have 1.2.3 here:

<script type="text/javascript" src="/jquery-1.2.3.min.js"></script>

and 1.4.2 here:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

If you have plug-ins that claim they each want a different version of jQuery, then you will need to work it out so they can both work on one common version.