Question

I’m trying to run three sets of JS code in my header tag, however, I can only seem to run two at a time with the following code (see below)…

(this code below works perfectly fine on it’s own)

    <link rel="stylesheet" href="http://www.frhdesigns.com/lightbox2.04/css/lightbox.css" type="text/css" media="screen" />
    <script type="text/javascript" src="http://www.frhdesigns.com/lightbox2.04/js/prototype.js"></script>
    <script type="text/javascript" src="http://www.frhdesigns.com/lightbox2.04/js/scriptaculous.js?load=effects,builder"></script>
    <script type="text/javascript" src="http://www.frhdesigns.com/jquery-vertical-scroll/js/jquery.min.js"></script>
    <script type="text/javascript">
         jQuery.noConflict();
    </script>
    <script src="http://www.frhdesigns.com/jquery-vertical-scroll/js/jquery.localscroll-min.js" type="text/javascript"></script>
    <script src="http://www.frhdesigns.com/jquery-vertical-scroll/js/jquery.scrollTo-min.js" type="text/javascript"></script>
    <script type="text/javascript" src="http://www.frhdesigns.com/lightbox2.04/js/lightbox.js">     
</script>
    <script type="text/javascript">
        jQuery(document).ready(function () {
            jQuery.localScroll.defaults.axis = 'y';
            jQuery.localScroll();
        });
    </script>

…Now when I add the third set of code to the mix (3rd set of js code below) which is a code for fading images, I can’t seem to get all three to work together when I view the page. I know JS is all about order…but I don’t know the order…

<script type="text/javascript" src="_fade_in/js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="_fade_in/js/custom.js"></script>

thanks!

---

ok. where should I place this line of code

<script type="text/javascript" src="_fade_in/js/custom.js"></script> 

**in the following sequence?**

<script type="text/javascript" src="http://www.frhdesigns.com/lightbox2.04/js/prototype.js"></script>

<script type="text/javascript" src="http://www.frhdesigns.com/lightbox2.04/js/scriptaculous.js?load=effects,builder"></script>

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


<script type="text/javascript">
    jQuery.noConflict();
</script>

<script src="http://www.frhdesigns.com/jquery-vertical-scroll/js/jquery.localscroll-min.js" type="text/javascript"></script>
<script src="http://www.frhdesigns.com/jquery-vertical-scroll/js/jquery.scrollTo-min.js" type="text/javascript"></script>

<script type="text/javascript" src="http://www.frhdesigns.com/lightbox2.04/js/lightbox.js"></script>
<script type="text/javascript">
        jQuery(document).ready(function () {
            jQuery.localScroll.defaults.axis = 'y';
            jQuery.localScroll();
        });
</script>

Answer 1

Judging by the names of your files, it looks like you are loading jQuery twice.

<script type="text/javascript" src="http://www.frhdesigns.com/jquery-vertical-scroll/js/jquery.min.js"></script>
<script type="text/javascript" src="_fade_in/js/jquery-1.3.2.min.js"></script>

Get rid of the second jQuery include and update the first to the particular version you need (if it isn’t already).