nav met extern bestand veranderen
Dag iedereen
Ik hoop dat ik dit juist post.
Ik heb een tutorial gevolgd voor een website te maken met jquery functies. Nu verwijst de navigatie in de index.html naar een ander bestand (boo.php). In dit bestand zit een case structuur om de gevraagde pagina te openen.
Is dit nu een goede manier? Ik zou denken van niet en dat het een beetje vertraagd.
Hier is de navigatie code:
Hoe ik de links ingeef:
Dit is een deel van boo.php
Mijn site vind je hier.
Alvast bedankt
Dag iedereen
Ik hoop dat ik dit juist post.
Ik heb een tutorial gevolgd voor een website te maken met jquery functies. Nu verwijst de navigatie in de index.html naar een ander bestand (boo.php). In dit bestand zit een case structuur om de gevraagde pagina te openen.
Is dit nu een goede manier? Ik zou denken van niet en dat het een beetje vertraagd.
Hier is de navigatie code:
Code:
<script src="jquery.min.js" type="text/javascript"></script>
<script>
// When the document loads do everything inside here ...
$(document).ready(function(){
Nifty("#menu a","small top transparent");
Nifty("#outcontent","medium bottom transparent");
$('.content').load('pages/boo.php'); //by default initally load text from boo.php
$('#menu a').click(function() { //start function when any link is clicked
$(".content").slideUp("slow");
var content_show = $(this).attr("title"); //retrieve title of link so we can compare with php file
$.ajax({
method: "get",url: "pages/boo.php",data: "page="+content_show,
beforeSend: function(){$("#loading").show("fast");}, //show loading just when link is clicked
complete: function(){ $("#loading").hide("fast");}, //stop showing loading when the process is complete
success: function(html){ //so, if data is retrieved, store it in html
$(".content").show("slow"); //animation
$(".content").html(html); //show the html inside .content div
}
}); //close $.ajax(
}); //close click(
}); //close $(
</script>Hoe ik de links ingeef:
Code:
<body>
<div class="page">
<div>
<ul id="menu">
<li id="home"><a href="#" title="home">Home</a></li>
<li id="line-up"><a href="#" title="line-up">Line-up</a></li>
<li id="tickets"><a href="#" title="tickets">Tickets</a></li>
<li id="fotos"><a href="#" title="fotos">Fotos</a></li>
<li id="gastenboek"><a href="#" title="gastenboek">Gastenboek</a></li>
<li id="locatie"><a href="#" title="locatie">Locatie</a></li>
<li id="helpers"><a href="#" title="helpers">Helpers</a></li>
<li id="sponsors"><a href="#" title="sponsors">Sponsors</a></li>
<li id="contact"><a href="#" title="contact">Contact</a></li>
</ul>
<br style="clear:both;" />
</div>Dit is een deel van boo.php
Code:
<?php
header("Cache-Control: no-cache");
sleep(2);
$p = $_GET['page'];
switch($p) {
case "home":default:
include("home.php");
break;
case "line-up":
echo 'line-up<br style="clear:both;" />';
break;
case "tickets":
echo 'tickets<br style="clear:both;" />';
break;Mijn site vind je hier.
Alvast bedankt
Laatst bewerkt:
