1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

Multiple Javascript On Same Page Not Working Help

Discussion in 'JavaScript' started by macaela, Jan 27, 2013.

  1. #1
    Hi I am trying to integrate two scripts of javascript on a single page one for a slider and the other for a scroller but if one works the other doesnt work, I have been trying to read about the jquery conflict but I cannot seem to be able to implement can someone please help me out

    these are the script I need on the page
        <!-- SLIDESHOW FILES -->
                <script type="text/javascript" src=" https://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.js"></script>
                <script type="text/javascript" src="<?php bloginfo('template_directory')?>/js/home-slider/jquery.jcarousel.min.js"></script>
                <script type="text/javascript" src="<?php bloginfo('template_directory')?>/js/home-slider/jquery-autoplay.pikachoose.js"></script>
                <script type="text/javascript" src="<?php bloginfo('template_directory')?>/js/home-slider/jquery.pikachoose.js"></script>
              <!-- SLIDESHOW FILES -->
           
            <!-- SCROLLER FILES -->     
                <script type="text/javascript" src="<?php bloginfo('template_directory')?>/js/image-scroller/jquery-1.2.1.pack.js"></script>
                <script type="text/javascript" src="<?php bloginfo('template_directory')?>/js/image-scroller/jMyCarousel.js"></script>
            <!-- SCROOLER FILES -->
           
           
            <!-- SLIDESHOW FUNCTION -->
                <script language="javascript">
                    $(document).ready(
                    function (){
                    $("#pikame").PikaChoose({carousel:true, hoverPause:true});
                    });
                </script>
            <!-- SLIDESHOW FUNCTION -->
           
            <!-- SCROLLER FUNCTION -->
              <script type="text/javascript">
                    $(function() {
                    $(".jMyCarousel").jMyCarousel({
                    visible: '4',
                    eltByElt: true,
                    evtStart: 'mousedown',
                    evtStop: 'mouseup'
                    });
     
                    });
                </script>
            <!-- SCROLLER FUNCTION -->
    Code (markup):
     
    macaela, Jan 27, 2013 IP
  2. artus.systems

    artus.systems Well-Known Member

    Messages:
    87
    Likes Received:
    1
    Best Answers:
    1
    Trophy Points:
    103
    #2
    Can you try replacing all the instance of $ with jQuery or $(function() { to jQuery(function($) and use only 1 document ready
     
    artus.systems, Jan 28, 2013 IP
  3. macaela

    macaela Active Member

    Messages:
    181
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    51
    #3
    Hi guys I've managed to fix this way thanks fo rthe help
            <!-- SCROLLER FILES    -->
                <script type="text/javascript" src="<?php bloginfo('template_directory')?>/js/image-scroller/jquery-1.2.1.pack.js"></script>
                <script type="text/javascript" src="<?php bloginfo('template_directory')?>/js/image-scroller/jMyCarousel.js"></script>
            <!-- SCROOLER FILES -->
     
            <!-- SLIDESHOW FILES -->
                <script type="text/javascript" src=" https://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.js"></script>
                <script type="text/javascript" src="<?php bloginfo('template_directory')?>/js/home-slider/jquery.jcarousel.min.js"></script>
                <script type="text/javascript" src="<?php bloginfo('template_directory')?>/js/home-slider/jquery-autoplay.pikachoose.js"></script>
              <!-- SLIDESHOW FILES -->
           
     
            <script type="text/javascript">
    $.noConflict();
    jQuery(document).ready(function($) {
                    $("#pikame").PikaChoose({carousel:true, hoverPause:true});
    });
        $(function() {
                    $(".jMyCarousel").jMyCarousel({
                    visible: '4',
                    eltByElt: true,
                    evtStart: 'mousedown',
                    evtStop: 'mouseup'
                    });
     
                    });</script>
    Code (markup):
     
    macaela, Jan 28, 2013 IP