// récupère la position y de la souris function getMouseY(e) { if(e!=null && typeof(e.pageY)!="undefined"){ return e.pageY; }else{ return (e!=null?e.clientY:event.clientY)+ document.documentElement.scrollTop; } }; /*--------------------------------------*/ /* GESTION DES SCROLLINGS */ /*--------------------------------------*/ /*--------------------------------------*/ // Gestion des fleches de la scrollbar var scrolling_timer; function launch_scrolling(id_scrollable, direction) { // Calcul du decalage a faire sur le curseur pour un decalage fixe sur la zone scrollable var decalage_scrollable = 20; //decalage a effectuer sur la zone scrollable var scrollable = $(id_scrollable); var scroller = $("scroller_" + id_scrollable); // calcul de la hauteur de la zone scrollable (masqué) var scrollable_height = scrollable.parentNode.offsetHeight - scrollable.offsetHeight; // calcul de la hauteur sur laquelle le cursor peut se deplacer var scroller_height = scroller.parentNode.offsetHeight - scroller.offsetHeight; var decalage = decalage_scrollable * (scroller_height / scrollable_height ); // si le scrollable height est negatif, c'est que le contenu scrollable est entierement visible // et ne nécessite pas de scroll if( scrollable_height < 0 ) { if(direction == "bottom") { decalage *= -1; } else { decalage *= 1; } } else { decalage = 0; } // on appelle une premiere fois la fonction de deplacement scrolling_arrow(id_scrollable, decalage); } function scrolling_arrow(id_scrollable, decalage) { // on bouge le curseur sur la scrollbar margin = scrolling_move_cursor(id_scrollable, decalage); // si le mouvement du curseur s'est bien déroulé... if( margin !== false ) { // on deplace l'element scrollable move_scrollable(id_scrollable, margin); // on déclenche le prochain deplacement scrolling_timer = window.setTimeout('scrolling_arrow("' + id_scrollable + '", ' + decalage + ')', 50 ); } } /** * permet d'arreter le scrolling */ function stop_scrolling() { window.clearTimeout( scrolling_timer ); } /** * permet de scroller la liste selectionnée */ function move_scrollable(id_scrollable, margin) { var scrollable = $(id_scrollable); var scroller = $("scroller_" + id_scrollable); // calcul de la hauteur de la zone scrollable (masqué) var scrollable_height = scrollable.parentNode.offsetHeight - scrollable.offsetHeight; // calcul de la hauteur sur laquelle le cursor peut se deplacer var scroller_height = scroller.parentNode.offsetHeight - scroller.offsetHeight; var decalage = margin * (scroller_height / scrollable_height ); // si le scrollable height est negatif, c'est que le contenu scrollable est entierement visible // et ne nécessite pas de scroll if( scrollable_height < 0 ) { // Calcul du decalage a faire sur la zone scrollable var new_margin = margin * (scrollable_height / scroller_height) ; scrollable.style.marginTop = parseInt(new_margin) + "px"; } } /** * permet de deplacement automatique du curseur sur le clic des fleches */ //function scrolling_move_cursor(id_scrollable, margin) function scrolling_move_cursor(id_scrollable, decalage) { var scroller = $("scroller_" + id_scrollable); var max_scroll = scroller.parentNode.offsetHeight - scroller.offsetHeight; // Récupération de l'ancienne marge et calcul de la nouvelle if(scroller.style.marginTop) { var margin = scroller.style.marginTop; old_margin = margin.substr( 0, margin.length - 2 ); } else { var old_margin = 0; } var new_margin = parseInt(old_margin) + decalage; // si la marge est superieur a la marge maximale diponible on prend la marge maximale dispo new_margin= Math.min(new_margin, max_scroll); // Si la marge est inferieur à 0 on lui donne 0 en valeur new_margin= Math.max(0, new_margin); // Si un depacement est effectif if( new_margin != old_margin ) { scroller.style.marginTop = new_margin + "px"; return new_margin; } else { return false; } } /*--------------------------------------*/ // Gestion du drag and drop du curseur var scroller = false; /** * initialise la gestion du drag and drop sur enfoncement du bouton de la souris */ function init_scroller_move( e, elt_scroller, id_scrollable ) { if(!e) e= event; scroller = elt_scroller; scroller.start_mouse_y = getMouseY(e); scroller.start_top_y = scroller.offsetTop; scroller.id_scrollable = id_scrollable; // défini le onmouseup qui correspondera à la fin du déplacement document.onmouseup = stop_scroller_move; document.onmousemove = scroller_move; } /** * deplace le curseur et l'element scrollable en fonction du mouvement de la souris */ function scroller_move(e) { if(!e) e= event; var mouse_y = getMouseY(e); var deplacement = mouse_y - scroller.start_mouse_y; var new_margin = scroller.start_top_y + deplacement; var max_scroll = scroller.parentNode.offsetHeight - scroller.offsetHeight; // si la marge est superieur a la marge maximale diponible on prend la marge maximale dispo new_margin= Math.min(new_margin, max_scroll); // Si la marge est inferieur à 0 on lui donne 0 en valeur new_margin= Math.max(0, new_margin); // on deplace le curseur scroller.style.marginTop = new_margin + "px"; // on deplace l'element scrollable move_scrollable(scroller.id_scrollable, new_margin); // annule l'evenement (évite la selectionne de texte en même temps que la déplacement) return false; } function stop_scroller_move() { document.onmouseup = ''; document.onmousemove= ''; } /*--------------------------------------*/ // Gestion de la mollete de la souris /** This is high-level function. * It must react to delta being more/less than zero. */ function handle(id_scrollable, delta) { if (delta < 0) launch_scrolling(id_scrollable, 'bottom'); else launch_scrolling(id_scrollable, 'top'); // on arrete dans tous les cas le timer stop_scrolling(); } /** * Event handler for mouse wheel event. */ function wheel(e) { if (!e) /* For IE. */ e = event; var delta = 0; // on récupère l'ID de la zone scrollable var id_scrollable = this.id.substr(this.id.indexOf('_') + 1, this.id.length); if (e.wheelDelta) { // IE/Opera. delta = e.wheelDelta/120; // In Opera 9, delta differs in sign as compared to IE. if (window.opera) delta = -delta; } else if (e.detail) { // Mozilla case. /** * In Mozilla, sign of delta is different than in IE. * Also, delta is multiple of 3. */ delta = -e.detail/3; } /** * If delta is nonzero, handle it. * Basically, delta is now positive if wheel was scrolled up, * and negative, if wheel was scrolled down. */ if (delta != 0) handle(id_scrollable, delta); /** * Prevent default actions caused by mouse wheel. * That might be ugly, but we handle scrolls somehow * anyway, so don't bother here.. */ if (e.preventDefault) e.preventDefault(); e.returnValue = false; }