Moved javascript to new page, not working

[Josiahmann]

Hello,

I know very little about javascript, so I hired someone to copy a js slider from one page to my test page. Now that I’m putting it on the live page, though, the slider isn’t working. I did move the items referenced in the JS to be included in the wordpress theme, but I believe I’ve linked the items correctly because the pictures are showing up. But there is no slider.

Important note – Site is built on a Genesis Child Theme for wordpress. Site I’m trying to get working is here and the site where it is working is here
Any thoughts?

[TheDoc]

There are a bunch of <p> in your JS that is throwing an error: http://cl.ly/image/3q2t1X1r3y0Y

[Kuzyo]

What is strange – that in working example there is too error about paragraph :)

[Josiahmann]

Hmm, I wonder if WordPress is automatically adding that. The code I have shows no

<

p>’s
`

    jQuery(function ($) {
    // Load dialog on click
      $("#slides #viewSample").click(function (e) {

          $("#youtube-channel").modal({onOpen: function (dialog) {
            dialog.overlay.fadeIn('slow', function () {
             dialog.container.slideDown('slow', function () {
              dialog.data.fadeIn('slow');
             });
            });
          }});
      return false;
      });
    });

<script type="text/javascript">
    jQuery(document).ready(function($) {
    // Creating hoverscroll with fixed arrows
    $('#my-list').hoverscroll({
        fixedArrows: true,
        rtl: true
    });
    // Starting the movement automatically at loading
    // @param direction: right/bottom = 1, left/top = -1
    // @param speed: Speed of the animation (scrollPosition += direction * speed)
    var direction = -1,
        speed = 2;
    $("#my-list")[0].startMoving(direction, speed);
    });
</script>

$(".customerLogos").hide(0).delay(3000).fadeIn(1000);


jQuery(document).ready(function($) {
     $('#menu li').hoverIntent({
        sensitivity: 7,
        over: function(e){
           $(this).find('ul.megamenu').css({visibility: 'visible',display: 'none'}).slideToggle();
        },
        out:function(e){
            $(this).find('ul.megamenu').css({visibility: 'hidden', display: 'none'});
        },
        timeout: 500
    });


    $('#fadeZoom1').cycle({ 
        animIn:'fadeZoom',
        fx:    'fadeZoom',
        speed: 1000, 
        sync:  false, 
        delay: 200 
    });

    $('#fadeZoom2').cycle({ 
        fx:    'fadeZoom', 
        speed: 1000,
        sync:  false, 
        delay: 700 
    }); 

    $('#fadeZoom3').cycle({ 
        fx:    'fadeZoom', 
        speed: 1000,
        sync:  false, 
        delay: 1300 
    });

    $('#fadeZoom4').cycle({ 
        fx:    'fadeZoom', 
        speed: 1000,
        sync:  false, 
        delay: 1800 
    });

    $('#fadeZoom5').cycle({ 
        animIn:'fadeZoom',
        fx:    'fadeZoom',
        speed: 1000, 
        sync:  false, 
        delay: 200 
    });

    $('#fadeZoom6').cycle({ 
        fx:    'fadeZoom', 
        speed: 1000,
        sync:  false, 
        delay: 700 
    }); 

    $('#fadeZoom7').cycle({ 
        fx:    'fadeZoom', 
        speed: 1000,
        sync:  false, 
        delay: 1300 
    });

    $('#fadeZoom8').cycle({ 
        fx:    'fadeZoom', 
        speed: 1000,
        sync:  false, 
        delay: 1800 
    });

    $('#fadeZoom9').cycle({ 
        animIn:'fadeZoom',
        fx:    'fadeZoom',
        speed: 1000, 
        sync:  false, 
        delay: 200 
    });

    $('#fadeZoom10').cycle({ 
        fx:    'fadeZoom', 
        speed: 1000,
        sync:  false, 
        delay: 700 
    }); 

    $('#fadeZoom11').cycle({ 
        fx:    'fadeZoom', 
        speed: 1000,
        sync:  false, 
        delay: 1300 
    });

    $('#fadeZoom12').cycle({ 
        fx:    'fadeZoom', 
        speed: 1000,
        sync:  false, 
        delay: 1800 
    });

    $('#fadeZoom13').cycle({ 
        animIn:'fadeZoom',
        fx:    'fadeZoom',
        speed: 1000, 
        sync:  false, 
        delay: 200 
    });

    $('#fadeZoom14').cycle({ 
        fx:    'fadeZoom', 
        speed: 1000,
        sync:  false, 
        delay: 700 
    }); 

    $('#fadeZoom15').cycle({ 
        fx:    'fadeZoom', 
        speed: 1000,
        sync:  false, 
        delay: 1300 
    });

    $('#fadeZoom16').cycle({ 
        fx:    'fadeZoom', 
        speed: 1000,
        sync:  false, 
        delay: 1800 
    });

    $('#fadeZoom17').cycle({ 
        animIn:'fadeZoom',
        fx:    'fadeZoom',
        speed: 1000, 
        sync:  false, 
        delay: 200 
    });

    $('#fadeZoom18').cycle({ 
        fx:    'fadeZoom', 
        speed: 1000,
        sync:  false, 
        delay: 700 
    }); 

    $('#fadeZoom19').cycle({ 
        fx:    'fadeZoom', 
        speed: 1000,
        sync:  false, 
        delay: 1300 
    });

    $('#fadeZoom20').cycle({ 
        fx:    'fadeZoom', 
        speed: 1000,
        sync:  false, 
        delay: 1800 
    });
});

`.

[TheDoc]

You should be adding this code at a template level. Are you trying to enter it into the WordPress page editor?

[Josiahmann]

Yes, it is in the WP editor. The gentleman I hired to copy the code said he had to do it that way because the page uses a child theme using the genesis framework and it would break the theme otherwise.
There is a section built in to put in script before the end of the footer, but he seemed to think it wouldn’t work there. Do I need to try to move it there?

[TheDoc]

But the whole point of using a child theme is so that you can make changes to the theme files… Hmmmmm…

[Josiahmann]

So are you saying this should be added at the footer? When I try adding to the footer, I get the same problem. It’s supposed to be in the sub-footer, but it does the same thing as well. ERRRR.

[Author]

Posts