osecHi,
I'm fairly new to coding wordpress and ive ran into a problem regarding Jquery Navigation.
Basically I have this jquery menu all sorted works fine when i open it in just index.php, but i cant get it to run with wordpress index.php? It will run if i have it has index.html but not with index.php and i don't know why?
Im pretty aware WordPress supports Jquery so i dont understand what is going wrong??
Heres the code to the index.php:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head profile="http://gmpg.org/xfn/11">
<title><?php bloginfo('name'); ?><?php wp_title(); ?></title>
<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
<meta name="generator" content="WordPress <?php bloginfo('version'); ?>" /> <!-- leave this for stats please -->
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" />
<link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="<?php bloginfo('rss2_url'); ?>" />
<link rel="alternate" type="text/xml" title="RSS .92" href="<?php bloginfo('rss_url'); ?>" />
<link rel="alternate" type="application/atom+xml" title="Atom 0.3" href="<?php bloginfo('atom_url'); ?>" />
<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
<script src="js/jquery-1.3.2.js" type="text/javascript"></script>
<script src="js/jquery.easing.1.3.js" type="text/javascript" charset="utf-8"></script>
<script src="js/animated-menu.js" type="text/javascript"></script>
<?php wp_get_archives('type=monthly&format=link'); ?>
<?php //comments_popup_script(); // off by default ?>
<?php wp_enqueue_script('jquery'); ?>
<?php wp_head(); ?>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body id="container">
<div id="header">
<div id="logocontainer">
<div id="logo"></div>
<div id="description"><?php bloginfo('description'); ?></div>
</div>
<div id="nav">
<ul>
<li class="green">
<p><a href="http://google.com">Home</a></p>
<p class="subtext">the front page</p>
</li>
<li class="yellow">
<p><a href="#">portfolio</a></p>
<p class="subtext">view our work</p>
</li>
<li class="red">
<p><a href="#">blog</a></p>
<p class="subtext">check out our blog</p>
</li>
<li class="blue">
<p><a href="#">about</a></p>
<p class="subtext">find out more</p>
</li>
<li class="purple">
<p><a href="#">contact</a></p>
<p class="subtext">get in touch</p>
</li>
</ul>
</div>
</div>
</body>
</html>And heres the code to the .js file:
$(document).ready(function(){
//Fix Errors - http://www.learningjquery.com/2009/01/quick-tip-prevent-animation-queue-buildup/
//Remove outline from links
$("a").click(function(){
$(this).blur();
});
//When mouse rolls over
$("li").mouseover(function(){
$(this).stop().animate({height:'71px'},{queue:false, duration:600, easing: 'easeOutBounce'})
});
//When mouse is removed
$("li").mouseout(function(){
$(this).stop().animate({height:'40px'},{queue:false, duration:1200, easing: 'easeOutBounce'})
});
});I just dont understand why??
s_ha_dum (was apljdi)