Om naadloze navigatie te bieden in inhoudsonderwerpen van meerdere pagina's, kunnen cursusontwerpers een D2L®-JavaScript-oplossing toevoegen aan HTML-inhoudsonderwerpen die koppelingen bevatten naar meerdere HTML-pagina's. Als een cursist met dit JavaScript naar een inhoudsonderwerp van meerdere pagina's navigeert, worden de koppelingen naar de HTML-pagina's verborgen in het inhoudsonderwerp van meerdere pagina's en navigeren de knoppen Volgende en Vorige van de Inhoudstool tussen de gekoppelde HTML-pagina's, in plaats van tussen inhoudsonderwerpen te navigeren. Zonder dit JavaScript kan de cursist de koppelingen naar de HTML-pagina's missen en op Volgende klikken, om naar het volgende inhoudsonderwerp te gaan.
|
Opmerking: Een cursusontwerper met gevorderde ervaring in HTML en JavaScript moet de D2L®-JavaScript-oplossing toevoegen aan een HTML-inhoudsonderwerp van meerdere pagina's in een cursus met lessen. |
Navigatie met meerdere pagina's gebruiken
Om de onderwerpsnavigatie van meerdere pagina's te kunnen gebruiken, moeten cursusontwerpers verschillende JavaScript-componenten opnemen en een wat speciale opmaak aan hun HTML toevoegen.
Het JavaScript opnemen
Er zijn drie JavaScript-verwijzingen die in uw HTML moeten worden opgenomen. U dient het volledige, juiste pad naar deze bronnen laten verwijzen door uw eigen Brightspace®-domein in de URL te gebruiken. Bijvoorbeeld:
1. Jquery (beschikbaar onder MIT-licentie)
<script src=”https://s.brightspace.com/lib/jquery/1.11.0/jquery.min.js"></script>
2. Jquery simulate (beschikbaar onder MIT-licentie)
<script src=" /d2l/lms/content/static/scripts/jquery.Simulate/jquery.simulate.js">
</script>
3.d2l-nav.js (D2L® Copyright)
<script src=" /d2l/lms/content/static/scripts/d2l-nav.js"></script>
CSS-opmaak toevoegen om uw navigatie te verbergen
|
Opmerking: D2L® raadt aan CSS-opmaak toe te voegen om uw navigatie te verbergen, maar het is een optionele stap. |
U kunt HTML gebruiken om uw navigatie-elementen te verbergen. Het verbergen van uw interne navigatie-elementen helpt verwarring voor cursisten te verminderen, omdat hierdoor alleen de Brightspace®-navigatie beschikbaar is. Bijvoorbeeld:
<style>
.d2l-hide { display: none; }
</style>
Uw navigatie verbergen
|
Opmerking: D2L® raadt aan uw navigatie te verbergen, maar het is een optionele stap. |
Markeer uw navigatie om gebruik te maken van uw CSS. Bijvoorbeeld:
<div id=”nav” class="d2l-hide">
<a href="page1.html">Page 1/4 - What is Lorem Ipsum?</a>
<a href="page3.html">Page 3/4 - Why do we use it?</a>
</div>
Markeer uw navigatie om de volgende en vorige koppelingen te identificeren
Gebruik de groepen d2l-nav-next en d2l-nav-prev om te bepalen welke href-koppelingen moeten worden gebruikt wanneer de cursist op de koppelingen Volgende en Vorige klikt. Bijvoorbeeld:
<div id=”nav” class="d2l-hide">
<a href="page1.html" class=”d2l-nav-next”>Page 1/4 - What</a>
<a href="page3.html" class=”d2l-nav-prev”>Page 3/4 – Why</a>
</div>