Have a look at this site that I developed for an agency.
I have used the localScroll plugin to scroll between the sections. They asked me to add another section and for whatever reason the plugin seems to be ignored. Click "Elixir of the Day" Then click the "Submit". Instead of scrolling to the section it just jumps to it and the hash appears in the URL. On none of the other links does this happen.
Here is the code used to invoke the scrolling with the new section highlighted:
$('#navContainer, #navShindigs, #navTidbits, #navBarnburners, #navLegend, #shindigs, **#recipeForm**').localScroll({
target: '#contentViewport',
easing: 'easeOutSine'
});
Here is the link to the section:
<a href="#recipeForm"><img id="submit_elixir" src="grfx/submit.png" /></a>
And here is the section:
<div id="recipeForm">
<section id="section_recipe">
<fieldset>
<h2>Submit a Recipe</h2>
<form id="mailform" name="contact" method="post" action="inc/procMail.php">
<label for="yourName">Your Name</label><input type="text" name="yourName" id="yourName" value="" />
<label for="yourEmail">E-mail Address</label><input type="text" name="yourEmail" id="yourEmail" value=""/>
<label for="yourMessage">Your Recipe</label><textarea name="yourMessage" id="yourMessage" rows="3"></textarea>
<input type="image" name="Send Recipe" alt="Send Recipe" class="sendEmail" src="grfx/submit_button.png" />
</form>
</fieldset>
</section>
</div>
Every other bit of jQuery code on the site works including scrolling for all of the other elements. It is just this added section which seems to be ignored.
Can anyone shed any light or provide any insight? I have never had a problem with the scrollTo or localScroll plugins ever before.