如何在页面上使用两个JavaScript

Question

this has been something that has baffled me for the longest with working with javscript. First there are two javascript codes i'm using.

Here is the first one

  <!-- The JavaScript -->
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>  
    <script type="text/javascript" src="jquery.easing.1.3.js"></script>
    <script type="text/javascript">
        $(function() {
            $('ul.nav a').bind('click',function(event){
                var $anchor = $(this);

                $('html, body').stop().animate({
                    scrollTop: $($anchor.attr('href')).offset().top
                }, 1500,'easeInOutExpo');
                /*
                if you don't want to use the easing effects:
                $('html, body').stop().animate({
                    scrollTop: $($anchor.attr('href')).offset().top
                }, 1000);
                */
                event.preventDefault();
            });
        });
    </script>

The Above code is used to make the page transition from one div to another smoothly. Like this ---> http://tympanus.net/Tutorials/WebsiteScrolling/index_vertical.html

here is the second one

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="http://littleladyenterprises.com/wp-content/themes/blackchic/WebsiteScrolling/css/jquery.sudoSlider.min.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
        var sudoSlider = $("#slider").sudoSlider({
            numeric: false,
            continuous:true
        });
 var sudoSlider2 = $("#slider2").sudoSlider();
});

</script>

This code is basically a slider

Ok, by placing the slider script last it works but it makes the fisrt script, the page transition script not work. I have seen this with many different scripts, I am not too JS saavy, but can anyone tell me how to make them both work on one page.

Answer 1

Get rid of the second call to the jquery library:

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

What is happening is you are overwriting the first instance of jquery, causing any bindings configured with it to be lost (ie the first script)