Question

HI I got some problem implemented 2 jquery in a html page
this is the query im using:

<script language="Javascript" type="text/javascript" src="js/jquery.blinds-0.9.js"></script>

 <script type="text/javascript">                  //running the script for blinds
    $(window).load(function () {
            // start the slideshow
    $('.slideshow').blinds();
    })
    </script>



<script language="Javascript" type="text/javascript" src="jquery.min.js"></script>
<script language="Javascript" type="text/javascript" src="jquery-ui.min.js"></script>

<script type="text/javascript">              //running the script for accordion
$(document).ready(function() {
$("#accordion").accordion();
});
</script>

The problem is only 1 script can run if I implement them both in html (either accordion or blinds), does anyone know how to modify them so all the jquery can run, and I can reuse them throughout a page?

e.g blinds wont run if i add the accordion js reference to the head.

Answer would be most appreciated, thanks in advance!

Answer 1

only one runs because the other is executed before jQuery was loaded

try:

<script src="jquery.min.js"></script>              <!--jQuery-->
<script src="jquery-ui.min.js"></script>           <!--jQueryUI plugin-->
<script src="js/jquery.blinds-0.9.js"></script>    <!--blinds plugin-->
<script>                                           <!--your scripts-->
    $(function() {
        $('#accordion').accordion();
        $('.slideshow').blinds();
    });
</script>

And jQueryUI has a built-in blinds effect. You might not need the blinds plugin if it does the same effect.