user3373667
user3373667

Reputation: 11

How to use multiple scripts in single page

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script src="jquery.blueberry.js"></script>

<script>

$(window).load(function() {
   $('.blueberry').blueberry();

});

</script>



<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="jquery.bxSlider.js"></script>
<script type="text/javascript">


    $(document).ready(function(){
          $('#slider').bxSlider({
              ticker: true,
              tickerSpeed: 5000,
              tickerHover: true
      });
    });


</script>       

I have used this query for gallery and content slider in same page when I run both, they don't work. Help me here im new to this

Upvotes: 0

Views: 791

Answers (3)

Felix
Felix

Reputation: 38112

You just need to include jQuery library once, so try:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script src="jquery.blueberry.js"></script>
<script src="jquery.bxSlider.js"></script>
<script>
$(window).load(function() {
    $('.blueberry').blueberry();
    $('#slider').bxSlider({
        ticker: true,
        tickerSpeed: 5000,
        tickerHover: true
    });
});
</script>

I choose version 1.6 here since I'm not sure the latest version of jQuery is compatible with your custom plugins or not.

Upvotes: 1

Dragick
Dragick

Reputation: 675

Which of your scripts isn't working?

For either of them to work, these two scripts would have to be in the same folder as your HTML page; jquery.blueberry.js jquery.bxSlider.js

Otherwise, you'll need to reference these to the folder they are in, such as ~/scripts/<>.js

Also, you've got 2 references to jQuery. One needs to go away (I'd suggest 1.6.1 goes as your loading the latest later). Otherwise if blueberry or bxSLider relies on 1.6.1 and the other relies on 2.1.0, you'll need to user jQuery.noConflict().

Upvotes: 2

Sajad Karuthedath
Sajad Karuthedath

Reputation: 15847

You add 2 standard versions of jquery. Use any one of of them

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script src="http://code.jquery.com/jquery-latest.js"></script>

add only

this at the top of all scripts

<script src="http://code.jquery.com/jquery-latest.js"></script>

Upvotes: 3

Related Questions