Javascript ne fonctionne plus avec des ancres twig
Bonjour à tous !
J'ai un menu spy qui permet à mes ancres de souligner les items du menu lorsqu'on est sur la section visée.
Cette fonction fait appel à un javascript et je suis dans un projet Symfony.
Mon problème est le suivant :
Lorsque je modifie les liens de mon menu "#section-1" en "{{ path('main_home') }}#section-1"
--> le javascript ne fonctionne plus et les items du menu ne se soulignent plus lors du défilement.
Voilà maintenant 2 jours que je me rends chèvre à essayer de décortiquer mon js à la recherche de la partie à modifier mais rien à faire.
Le code que j'ai essayé (trouvé sur un forum) :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
| <script type="text/javascript">
function changeHash(){
$('.add-fragment').each(function () {
let _fragment = window.location.hash.substr(1);
let href = $(this).attr('href').split('#')[0];
$(this).attr('href', href+'#'+_fragment);
})
}
$(document).ready(function () {
changeHash();
window.addEventListener("hashchange", function(){changeHash();}, false);
});
</script> |
et le menu :
Code:
1
2
3
4
5
6
7
8
| <nav>
<ul>
<li class="active"><a class="add-fragment" href="{{ path('main_test', {'_fragment': 'home'}) }}">Home</a></li>
<li><a class="add-fragment" href="{{ path('main_test', {'_fragment': 'section-2'}) }}">Section 1</a></li>
<li> <a class="add-fragment" href="{{ path('main_test', {'_fragment': 'section-2'}) }}">Section 2</a></li>
<li><a class="add-fragment" href="{{ path('main_test', {'_fragment': 'section-3'}) }}">Section 3</a></li>
</ul>
</nav> |
Un immense merci de votre aide !
