Help with Jquery active navigation
Posted: Wed Mar 12, 2014 1:26 pm
I have a jQuery script that is firing but it keeps resetting once the page is refreshed. I have searched and searched for a good tutorial for this and cannot find one. There are alot of bad ones out there. Here is what I am working with:
Navigation:
Jquery Script:
Here is where I initialize Jquery:
Finally, This is the scripts that are called:
The jQuery is doing what it is supposed to do. It removes all active classes and adds active to the correct clicked link but then it resets back to the home. What am I doing wrong? Thanks in advance.
Navigation:
Code: Select all
<li><a class="nav_btns active" href="?main">Home</a></li>
<li><a class="nav_btns" href="?demo">Demo</a></li>
<li><a class="nav_btns" href="?videos">Videos</a></li>
<li><a class="nav_btns" href="?pics">Pictures</a></li>
<li><a class="nav_btns" href="?price">Pricing</a></li>
<li><a class="nav_btns" href="?faq">FAQ</a></li>
<li><a class="nav_btns" href="?aboutus">About Us</a></li>
<li><a class="nav_btns" href="?contactus">Contact Us</a></li>Code: Select all
<script type="text/javascript">
$(document).ready(function() {
$('a.nav_btns').click(function() {
$('a.nav_btns').removeClass("active");
$(this).addClass("active");
});
});
</script>Code: Select all
echo $Sys->Content->meta(); <---- included below
echo $Sys->head();
//Load Jquery scripts
$Sys->Template->load(TEMP. 'main' . php_ext); <--- this is the script that changes the active class to the link that was clicked
echo $Sys->Content->wrapper(); <-- the ul nav is called here so the script is before the navigation
Code: Select all
<script type="text/javascript" src="core/js/jquery.min.js"></script>
<script type="text/javascript" src="core/js/custom.min.js"></script>
<script type="text/javascript" src="core/js/colorbox.js"></script>
<script type="text/javascript" src="core/js/tiny_mce/tiny_mce.js"></script>