Filtrage contenu à partir d'un lien du menu

Bonjour,

mon site utilise sur la page Cours, jQuery pour filtrer les cours par catégorie d'âge (enfants-ados-adultes), quand on clique sur une des catégories, jQuery filtre les résultats sur cette page, celà fonctionne nickel, le souci est que je voudrais optenir également ce résultat aussi depuis le menu statique qui est en haut de page, c'est à dire faire appel à cette fonction de filtrage depuis un lien url de type : monsite.com/cours/filtrelescoursparenfants ceci afin d'éviter aux visiteurs de devoir cliquer d'abord sur le menu Cours, puis arriver sur la page cours de devoir cliquer sur la catégorie de leur choix pour filtrer par catégorie :)

voici le code html de la partie de la page qui appelle le jquery :

Code:

1
2
3
<ul id="cat-filter" class="item-filter">
    <li><a data-categories="*" class="active">Tous</a></li>
    <li><a data-categories="ados-adultes">Ados / Adultes</a></li><li><a data-categories="adultes">Adultes</a></li><li><a data-categories="art-plastique">Art Plastique</a></li><li><a data-categories="chant">Chant</a></li><li><a data-categories="danse">Danse</a></li><li><a data-categories="enfants">Enfants</a></li><li><a data-categories="percussions">Percussions</a></li><li><a data-categories="theatre">Théâtre</a></li>            </ul>

et voici la fonction jquery dans mon fichier externe custom.js

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
/* Items Filter	 ---------------------------------------------------------------------- */
(function() {
	if (!$.fn.isotope) return;
	var $container = $('.items');
	if ($container.length) {
		var mouseOver;
		// Init Isotope
		$(window).on('load', function() {
			$container.isotope({
				portfolioelector : 'article',
				layoutMode   : 'fitRows',
				hiddenStyle: /msie [1-8]./.test(navigator.userAgent.toLowerCase()) ? { opacity: 0, top: -400 } : { opacity: 0, scale: 0.001 }
			});
		});
		// Add filter event
		function _items_filter($el, $data) {
			// Add all filter class
			$el.addClass('item-filter');
			// Add categories to item classes
			$('article', $container).each(function(i) {
				var $this = $(this);
				$this.addClass($this.attr($data));
			});
			$el.on('click', 'a', function(e){
				var $this   = $(this),
					$option = $this.attr($data);
				// Add active filter class
				$('.item-filter').removeClass('active-filter');
				$el.addClass('active-filter');
				$('.item-filter:not(.active-filter) li a').removeClass('active');
				$('.item-filter:not(.active-filter) li:first-child a').addClass('active');
				// Add/remove active class for this filter
				$el.find('a').removeClass('active');
				$this.addClass('active');
				if (typeof Cufon != 'undefined') Cufon.refresh();
				if ($option) {
					if ($option !== '*') $option = $option.replace($option, '.' + $option)
					$container.isotope({ filter : $option });
				}
				e.preventDefault();
			});
			$el.find('a').first().addClass('active');
		}
		// Init filters
		if ($('#cat-filter').length) _items_filter($('#cat-filter'), 'data-categories');
		if ($('#tag-filter').length) _items_filter($('#tag-filter'), 'data-tags');
	}
})();

Merci d'avance pour votre aide!
David