I am trying to add a very simple image swap on rollover jQuery script. But it's not working (nor are the others I've tried). Perhaps I need to do this differently than I am accustomed to. Here's what I'm doing:
I created a new template. Here's the code:
<?php
/*
Template Name: Test
*/
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Jeff's Past | Outtacontext</title>
<!-- add feeds, pingback and stuff-->
<link rel="profile" href="http://gmpg.org/xfn/11" />
<link rel="alternate" type="application/rss+xml" title="Outtacontext RSS2 Feed" href="http://www.outtacontext.com/wp2/feed/" />
<link rel="pingback" href="http://www.outtacontext.com/wp2/xmlrpc.php" />
<script type='text/javascript' src='http://www.outtacontext.com/wp2/wp-includes/js/jquery/jquery.js?ver=1.7.2'></script>
<script type='text/javascript' src='http://www.outtacontext.com/wp2/wp-content/themes/sentence/js/image_swap.js'></script>
<link rel="stylesheet" href="<?php echo get_bloginfo('template_url'); ?>/css/layout.css?v=1" type="text/css" media="screen" />
<link rel="stylesheet" href="<?php echo get_bloginfo('template_url'); ?>/css/custom.css" type="text/css" media="screen" />
<!-- google webfont font replacement -->
<link id="google_webfont_1" rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Varela+Round" />
<!--<meta name="viewport" content="width=device-width"> -->
!-- mobile setting -->
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
</head>
<body id="past_background">
<div class="past_center">
<?php if (have_posts()) : while (have_posts()) : the_post();?>
<?php the_content(); ?>
<?php endwhile; endif; ?>
<div id="footer">
<div id="menu">
<ul>
<li><a href="http://outtacontext.com/wp2/index.php">Home</a></li>
<li><a href="http://outtacontext.com/wp2/blog">Blog Archives</a></li>
<li><a href="http://outtacontext.com/wp2/artprojects">Art Projects</a></li>
<li><a href="http://outtacontext.com/wp2/articles">Articles</a></li>
<li><a href="http://outtacontext.com/wp2/about">About</a></li>
<li><a href="http://outtacontext.com/wp2/contact">Contact</a></li>
</ul>
</div>
</div>
</div>
</body>
</html>
I link to the jQuery library you have with the theme. Then I link to the image swap code.
And here's the page it's suppose to work on: http://www.outtacontext.com/wp2/about/past5/
But, as I said, the swapping isn't working. Is there something I should be doing differently when using this theme or Wordpress?














