I'm designing a wordpress theme on a local host and am trying to use a simple jquery function (the first one on the page I linked to) on my main page that cycles through a handful of images, fading between each image.
I'm loading jquery using google in my functions.php by using this:
if( !is_admin()){ wp_deregister_script('jquery'); wp_register_script('jquery', ("http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"), false, '1.4.4'); wp_enqueue_script('jquery'); }and I'm also doing this in the head section of my header.php:
<?php wp_enqueue_script('jquery'); ?> <?php wp_head(); ?> <script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/jquery.cross-slide.min.js"></script> <script type="text/javascript"> $('#slideshow').crossSlide({ sleep: 2, fade: 1 }, [ { src: 'images/girlgroup1.jpg' }, { src: 'images/girlgroup2.jpg' }, { src: 'images/girlgroup3.jpg' }, { src: 'images/girlgroup4.jpg' }, { src: 'images/girlgroup5.jpg' } ]); </script>I've created a DIV with an id of 'slideshow' in my CSS and given it a width and a height.
I'm a total newbie to javascript/jquery so for all I know, I'm doing this completely wrong. Does anyone have any idea why this isn't working?
I've tried posting to the wordpress forums to no avail. Any help at all will be greatly appreciated. Thanks so much!