Heudiasyc - Recrutement

UMR CNRS 7253 : Heuristique et Diagnostic des Systèmes Complexes

English

Laboratoire

Recherche

Carrières

Production

Etudiants

Industriels

Communauté
scientifique

menu recrutement

Recrutement

Les offres d'emplois se trouvent dans le menu de navigation à gauche.

Le Javascript/JQuery

En premier lieu, on stoppe le comportement normal du lien. Ensuite, en fonction de la classe de l'item sur lequel on a cliquéon adopte diffénte comportement.

1. Si on a cliquéur un lien dont le parent li àa classe item (c'est àire un li sans sous menu), on enlè la class selected de tous les éments. On ferme tous lus menu et enfin on ajoute la classe selected à'ément cliqué/p>

2. Si on a cliquéur un lien dont le parent li àa classe sub, on déie le sous menu si ce dernier est fermésinon on l'ouvre.

3. Si on a cliquéur un lien dont le parent li àa classe sousitem, on enlè la class selected de tous les éments. On ajoute la classe selected à'ément cliquérme les autres sous menu

var $$ = $(this);
//On cache tous les sous menus
$$.find('li > ul').hide();
$$.find('a').click(function(e){
        //On ne suit pas le lien
        e.preventDefault();

        if($(this).parent().hasClass('item')){

                //On enlè toutes les classes selected
                $$.find('li').removeClass('selected');

                //On ferme tous les menus déulant
                $$.find('li.sub').children('ul').slideUp('slow');

                //On ajoute la class selected au parent de l'ément cliqué       $(this).parent().addClass('selected');

        }else if($(this).parent().hasClass('sub')){

                if($(this).parent().children('ul').css('display') == 'none'){
                        $(this).parent().children('ul').slideDown('slow');
                }else{
                        $(this).parent().children('ul').slideUp('slow');
                }

        }else if($(this).parent().hasClass('sousitem')){
                //Si on clique sur un sous menu

                //On enlè toutes les classes selected
                $$.find('li').removeClass('selected');

                //On ajoute la class selected au parent de l'ément cliqué       $(this).parent().addClass('selected');

                $$.find('li.sub').children('ul').each(function(){
                        if(($(this).css('display')=='block')){
                                if($(this).children('li').hasClass('selected')){

                                }else{
                                        $(this).slideUp('slow');
                                }
                        }
                });
        }
});

Il reste maintenant àér le chargement des pages lors d'un clic. Au chargement de la page, on masque toutes les divs de contenu, sauf la premiè.

$("#contenu div:not(:first)").each(function(i){
        $(this).hide();
});

Lors d'un clic sur un lien, on met le contenu de l'attribut href dans la variable nom. On essaie de charger le fichier en AJAX. Si on ne trouve pas le fichier, on enlè l'extension (.htm dans l'exemple) et on essaie d'afficher la div avec cet ID.

var nom = $(this).attr('href');
//Si il y a une page àharger
if(nom){
        $('#contenu').load(nom, function(response, status, xhr) {
                if (status == "error") {
                        var msg = "Aucune page àharger";
                        //$("#contenu").html(msg + xhr.status + " " + xhr.statusText);

                        //On va regarder si une div existe
                        var nomdiv = nom.substring(0,nom.lastIndexOf('.'));
                        //alert(nomdiv);
                        $("#contenu div").each(function(i){
                                $(this).slideUp('slow');
                        });

                        $('#contenu div#'+nomdiv).slideDown('slow');
                }
        });
}