IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

Ajouter un mousewheel a une scrollbar


Sujet :

JavaScript

  1. #1
    Membre du Club
    Profil pro
    Inscrit en
    Juin 2009
    Messages
    60
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Juin 2009
    Messages : 60
    Points : 42
    Points
    42
    Par défaut Ajouter un mousewheel a une scrollbar
    Bonjour,

    Voila mon soucis .... je dois passer après quelqu'un pour notamment modifier un élément d'un site à savoir ajouter l'utilisation de la molette pour les scrollbar ....
    et la je sèche !!!!!!!!!
    Je vous met le code à tout hasard si quelqu'un à une idée ...
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    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
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
     
    var dom = document.getElementById;
    var iex = document.all;
    var ns4 = document.layers;
    var mouseX, mouseY, enterX, enterY;
     
     
    function addEvent(event,method)
    {
    	this[event] = method;
    	if(ns4) this.captureEvents(Event[event.substr(2,event.length).toUpperCase()]);
    }
     
    function removeEvent(event)
    {
    	this[event] = null;
    	if(ns4) this.releaseEvents(Event[event.substr(2,event.length).toUpperCase()]);
    }
     
    function getElement(name)
    {
    	var el = dom ? document.getElementById(name) : iex ? document.all[name] : ns4 ? eval("document."+name) : false;
    	if ( el == null ) return null;
    	el.css = ns4 ? el : el.style;
    	el.getTop = function(){return parseInt(el.css.top) || 0};
    	el.setTop = function(y){el.css.top = ns4 ? y: y+"px"};
    	el.getLeft = function(){return parseInt(el.css.left) || 0};
    	el.setLeft = function(x){el.css.left = ns4 ? x: x+"px"};
    	el.getHeight = function(){return ns4 ? el.document.height : el.offsetHeight};
    	el.getWidth = function(){return ns4 ? el.document.width : el.offsetWidth};
    	el.getClipHeight = function(){return ns4 ? el.clip.height : el.offsetHeight};
    	el.hideVis = function(){el.css.visibility="hidden"};
    	el.showVis = function(){el.css.visibility="visible"};
    	el.addEvent = addEvent;
    	el.removeEvent = removeEvent;
    	return el;
    }
     
    function getYMouse(e)
    {
    	return iex ? event.clientY : e.pageY;
    }
     
    document.addEvent = addEvent;
    document.removeEvent = removeEvent;
     
    ScrollObj = function(speed, groupName)
    {
    	this.speed = speed;
    	this.trackObj = getElement(groupName+"ScrollTrack");
    	this.dragObj = getElement(groupName+"ScrollThumb");
    	this.contentMaskObj = getElement(groupName+"ContentClip");
    	this.contentObj = getElement(groupName+"Content");
    	this.obj = groupName+"ContentObject";
    	eval(this.obj+"=this");
     
    	this.dragHeight = this.dragObj.getHeight()-2 - (iex ? 4 : 0);
    	this.trackHeight = getElement(groupName+"ScrollThumbTrack").getHeight();
    	this.trackTop = this.trackObj.getTop();
    	this.trackLength = this.trackHeight-this.dragHeight;
    	this.trackBottom = this.trackTop+this.trackLength;
    	this.contentMaskHeight = this.contentMaskObj.getClipHeight();
    	this.contentHeight = this.contentObj.getHeight();
    	this.contentLength = this.contentHeight-this.contentMaskHeight;
    	this.scrollLength = this.trackLength/this.contentLength;
    	this.scrollTimer = null;
     
     
    	if (this.contentHeight <= this.contentMaskHeight) {
    		this.dragObj.hideVis();
    	} else {
    		var self = this;
    		this.dragObj.addEvent("onmousedown", function(e){self.startDrag(e);return false});
     
    		if(iex) this.dragObj.addEvent("ondragstart", function(){return false});
    		this.dragObj.showVis();
    	}
    }
     
    ScrollObj.prototype.startDrag = function(e)
    {
    	this.dragStartMouse = getYMouse(e);
    	this.dragStartOffset = this.dragObj.getTop();
    	var self = this;
    	document.removeEvent("onmousemove");
    	document.addEvent("onmousemove", function(e){self.drag(e)});
    	document.addEvent("onmouseup", function(){self.stopDrag()});
    }
     
    ScrollObj.prototype.stopDrag = function() 
    {
    	document.removeEvent("onmousemove");
    	document.addEvent("onmousemove", getYMouse);
    	document.removeEvent("onmouseup");
    }
     
    ScrollObj.prototype.drag = function(e)
    {
    	var currentMouse = getYMouse(e);
    	var mouseDifference = currentMouse-this.dragStartMouse;
    	var dragDistance = this.dragStartOffset+mouseDifference;
    	var dragMovement = (dragDistance<this.trackTop) ? this.trackTop : (dragDistance>this.trackBottom) ? this.trackBottom : dragDistance;
    	this.dragObj.setTop(dragMovement);
    	var contentMovement = -(dragMovement-this.trackTop)*(1/this.scrollLength);
    	this.contentObj.setTop(contentMovement);
    }
     
    ScrollObj.prototype.scroll = function(speed)
    {
    	var contentMovement = this.contentObj.getTop()+speed;
    	var dragMovement = this.trackTop-Math.round(this.contentObj.getTop()*(this.trackLength/this.contentLength));
    	if(contentMovement > 0){
    		contentMovement = 0;
    	}else if(contentMovement < -this.contentLength){
    		contentMovement = -this.contentLength;
    	}
    	if ( dragMovement < this.trackTop ) {
    		dragMovement = this.trackTop;
    	} else if ( dragMovement > this.trackBottom ) {
    		dragMovement = this.trackBottom;
    	}
    	this.contentObj.setTop(contentMovement);
    	this.dragObj.setTop(dragMovement);
    	this.scrollTimer = window.setTimeout(this.obj+".scroll("+speed+")",25);
    }
    Bon courage !!!!!!!!!

  2. #2
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 644
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 74
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 644
    Points : 66 671
    Points
    66 671
    Billets dans le blog
    1
    Par défaut
    moose or mouse ?

  3. #3
    Membre du Club
    Profil pro
    Inscrit en
    Juin 2009
    Messages
    60
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Juin 2009
    Messages : 60
    Points : 42
    Points
    42
    Par défaut
    C'est vrai ça , c'est pas faux ...
    Je parle de la mi-molette (l ' autre pays du fromage) sur la souris ...

    Bon courage

  4. #4
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 644
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 74
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 644
    Points : 66 671
    Points
    66 671
    Billets dans le blog
    1
    Par défaut
    ^^ c'était à propos de la coquille dans ton titre ^^

    heu c'est pas par defaut la molette sur les scrollbars ? ou ce sont des scrollbars perso ?

    sinon un petit script pour l'amie molette
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    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
     
    <script type="text/javascript">
    var mouvement=0
    function Affiche(sens) {
    	mouvement += sens
    	document.getElementById('temoin').innerHTML = Math.floor(mouvement);
    }
     
    function Molette(event){
    	var sens = 0;
    	if (!event){event = window.event;}
    	if (event.wheelDelta) {
    	   	sens =(window.opera)?-event.wheelDelta/120: event.wheelDelta/120; 
           }
        else {sens=(event.detail)?-event.detail/3:sens;
    	   }
    	if (sens)
    		Affiche(sens);
    }
     
    // Lancement 
    if (window.addEventListener){window.addEventListener('DOMMouseScroll', Molette, false);}
    else{window.onmousewheel =function(){Molette()};
         document.onmousewheel = function(){Molette()};
        }
     
    </script>
    </head>
    <body>
    <div id="temoin"></div>
     
    </body>
    </html>

  5. #5
    Membre du Club
    Profil pro
    Inscrit en
    Juin 2009
    Messages
    60
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Juin 2009
    Messages : 60
    Points : 42
    Points
    42
    Par défaut
    Merci carrément pour la réponse !!!
    J'essaye ça dans l'aprem(ont --> pour rester dans le fromage ...) et je vous tient au courant !!!!

    Merci et à tout a l'heure ....

  6. #6
    Membre du Club
    Profil pro
    Inscrit en
    Juin 2009
    Messages
    60
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Juin 2009
    Messages : 60
    Points : 42
    Points
    42
    Par défaut
    C'est embêtant .... ça marche pas ....
    C'est pour une scrollbar perso (qui n'est pas à moi sinon je n'aurais pas mis ce type de !!!!!!!!!!!) .
    J'ai essayé avec jscrollpane ... mais ça me fait un énorme conflit avec l'accordéon maison (qui n'est pas de moi non plus ...)

    N'hésitez pas si vous avez d'autres solutions

  7. #7
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 644
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 74
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 644
    Points : 66 671
    Points
    66 671
    Billets dans le blog
    1
    Par défaut
    heu "ça marche pas" est un symptome assez vaste ...
    On peut voir la tentative d'adaptation ?
    sur le tournage de molette tu joue sur le scrollTop de ton element

  8. #8
    Membre du Club
    Profil pro
    Inscrit en
    Juin 2009
    Messages
    60
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Juin 2009
    Messages : 60
    Points : 42
    Points
    42
    Par défaut
    Après de rudes heures et un long combat (j'ai démonté tout l'ancien code et je l'ai remis à neuf ..... ) j'y suis arrivé !!!!!!
    Merci pour tout , je repart sur le forum php je cherche un moyen de sauter des lignes ou encore mieux des pages avec PHPrtf !!!!

    Merci encore

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Ajouter une scrollbar à une JList
    Par DiverSIG dans le forum Débuter
    Réponses: 5
    Dernier message: 30/03/2009, 13h12
  2. ajouter une scrollbar à une interface
    Par ddach dans le forum Débuter
    Réponses: 2
    Dernier message: 12/08/2008, 18h11
  3. Comment ajouter une ScrollBar dans un TComboBox ?
    Par MottetCCSF dans le forum Composants VCL
    Réponses: 1
    Dernier message: 31/10/2007, 20h44
  4. [C#][2.0] Comment ajouter une scrollbar a un gridview?
    Par just1980 dans le forum ASP.NET
    Réponses: 7
    Dernier message: 09/01/2007, 02h24
  5. [JTree] Ajouter une scrollbar
    Par Farias dans le forum Composants
    Réponses: 2
    Dernier message: 29/10/2004, 01h21

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo