Ik wil graag op een site een muziekspeler hebben voor achtergrond muziek. Maar ik wil dat als je op een andere pagina klikt dat de muziek niet stopt. Dus ik wil een div die blijft staan en niet refresht wordt als je een andere pagina aan klikt.
Kan iemand mij een manier uitleggen om dit te doen?
Ten eerste om te beginnen raad ik je af dit te doen. voor veel gebruikers is dit storend is gebleken.
Mocht je dit toch door willen zetten dan zou ik je content gedeelte dmv ajax ( javascript ) ophalen. als je hiervoor jQuery ( javascript library ) gebruikt dan is het een stuk makkelijker dan raw javascript te gebruiken.
Ook al is het voor iemand anders, jij bouwt de website... Oftewel jij bent de 'expert' anders had de klant zelf wel de website gemaakt. De klant dus overtuigen om het niet te doen...
Je kunt gerust muziek aanbieden op je webpagina. Alleen adviseer ik om de muziek niet automatisch te laten starten maar pas als de gebruiker op de afspeeltoets klikt.
Als je niet wilt dat de muziek onderbroken wordt kun je twee dingen doen:
1. alle pagina's in één bestand zetten en werken met hidden div's en javascript:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<style>
div.page {
display:none;
}
#home {
display:block;
}
</style>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
$(document).ready(function(e) {
$('a.page').click(function(e) {
$('div.page').hide();
$($(this).attr('href')).show();
return false;
});
});
</script>
</head>
<body>
<ul>
<li><a class="page" href="#home">Home</a></li>
<li><a class="page" href="#about">About</a></li>
<li><a class="page" href="#contact">Contact</a></li>
</ul>
<div class="page" id="home">
This is the homepage
</div>
<div class="page" id="about">
This is the aboutpage
</div>
<div class="page" id="contact">
This is the contactpage
</div>
</body>
</html>
2. de div's met AJAX calls een nieuwe inhoud geven.
