I should preface this by saying that I am by no means a Web Designer ... I'm just trying to build a site for myself and have taken on the challenge of not using Wordpress. Essentially, I am trying to find a jquery function that can open links (of htmls from my own server) from my ul nav bar in a specified div tag (preferably the same div) -- i want this to work more or less like an iframe. I first attempted this by trying to learn php but was too overwhelmed. I have read on several forums this is possible using javascript. And have even found an example doing essentially what i want: http://www.dynamicdrive.com/dynamici...jaxcontent.htm
But i am still having issues getting the link to open in the div -- in the html below the div is id'd #container
<body>
<div id="page_effect" style="display:none;">
<BR>
<div id="a1-title"><FONT SIZE="6" COLOR="#382D2C" FACE="Arial Black"><b>mytitle</b>
</div>
<BR>
<div id="nav">
<ul>
<li class="everything"><a href="https://pupilpath.nvskedula.com">current</a></li>
<li class="everything"><a href="https://pupilpath.nvskedula.com">past</a></li>
<li class="everything"><a href="blacktempl.html" class="ajaxLink">text</a></li>
<li class="everything"><a href="CV.html" target="_self">bio</a></li>
<li class="everything"><a href="kameraden.html" target="iframe-container">kameraden</a></li>
<li class="everything"><a href="https://pupilpath.nvskedula.com">inflammatio</a></li>
</ul>
</div>
<BR>
<div><video id="a8-video" class="everything" width="540" height="380" controls="controls"> <video src="caughtmapping1940.mp4" type="video/mp4" />
</video></div>
<div id="content" class="ajaxLink" style="border-style: none><p>this needs to work</p>
</div>
</ body>
*********************
And here is the Jquery I am working with (it's the last function):
$(document).ready(function(){
$('#page_effect').fadeIn(1500);
});
$(document).ready(function() {
var eT=0;
$('.everything').hide().each(function() {
$(this).delay(eT).fadeIn('slow');
eT += 200;
});
$('.everything').click(function() {
$('.everything').stop(true,true).fadeIn();
});
});
$(document).ready(function(){
$('a.ajaxLink').click(function(){
var url = $(this).attr('href');
$('#container').empty().load(url);
});
return false;
});