Named anchor not positioned when referenced by href link
Problem:
I have several named anchors on a page. I also insert snippets of html onto the page using the the .load() AJAX function wrapped in a $(document).ready(... . page loads fine, html is properly inserted.
When an external page attempts to go to the anchor however the positioning is not where it should be. The page that is referenced is loaded, but the point where the anchor is expected is elsewhere.
Code samples --
jQuery --
$(document).ready(function(){
$('#ioi').load('ioi.inc');
$('#ql').load('ql.inc');
$('#price-patio').load('pricelist.txt #A');
$('#price-log').load('pricelist.txt #B');
$('#price-tin').load('pricelist.txt #C');
$('#price-rt1').load('pricelist.txt #D');
$('#price-rt2').load('pricelist.txt #E');
});
html --
<div class="post">
<h2 class="title" id="patio">Patio Timbers</h2>
<div class="entry">
<br>
<img src="./pictures/79270010.jpg" width="520" alt="Patio" />
<p> Fresh cut Cedar, Cypress, Red and White Oak. Maximum
length is 12'. Pricing is per linear foot. Pricing subject to change
based on availability and size of the order.</p>
<p>Custom cut any diameter in size and up to 40' length
available upon request.</p>
<div id="price-patio">
</div>
</div>
</div>
Any workarounds for this side effect?
Thanks!