Accueil > Forum > > > > scroll bar avec roll over
 scroll bar avec roll over
mercredi 28 septembre 2005 à 23:26:31 |
scroll bar avec roll over
Le Zbire
|
Dans les sections en rouge je voudrais faire un roll over j'ai essayer multiple moyens mais sa donne rienvous pourvez m'aider?La section bleu n'y touchez pas c'est le texte de la frame. Merci d'avance
<META http-equiv=Content-Type content="text/html; charset=iso-8859-1">
<script type="text/javascript">
var dom = document.getElementById; var ie = document.all;
function capEv(event,method){this[event] = method;};function relEv(event){ this[event] = null;};function getYs(e){ return ie ? event.clientY : e.pageY;}
function getEl(nm){var el = dom ? document.getElementById(nm) : ie ? document.all[nm] : false;el.getTop = function(){return parseInt(el.offsetTop) || 0}; el.setTop = function(y){el.style.top = y+"px"};el.getHeight = function(){return el.offsetHeight}; el.getClipHeight = function(){return el.offsetHeight}; el.capEv = capEv; el.relEv = relEv; return el;}
document.capEv = capEv; document.relEv = relEv;
sObj = function(s, tObj, uObj, dObj, dgObj, hObj, cObj){
this.s = s; var self = this; this.tObj = getEl(tObj); this.uObj = getEl(uObj); this.dObj = getEl(dObj); this.dgObj = getEl(dgObj); this.hObj = getEl(hObj); this.cObj = getEl(cObj,hObj);
this.dH = this.dgObj.getHeight(); this.tH = this.tObj.getHeight(); this.obj = cObj+"Object"; eval(this.obj+"=this"); this.tT = this.dgObj.getTop(); this.tL = this.tH-this.dH; this.tB = this.tT+this.tL; this.hH = this.hObj.getClipHeight(); this.cH = this.cObj.getHeight(); this.cL = this.cH-this.hH; this.sL = this.tL/this.cL; this.sT = null;
this.tObj.capEv("onmousedown", function(e){self.sJmp(e);return false}); this.uObj.capEv("onmousedown", function(){self.scroll(self.s);return false});
this.uObj.capEv("onmouseup", function(){self.stSc()}); this.uObj.capEv("onmouseout", function(){self.stSc()}); this.dObj.capEv("onmousedown", function(){self.scroll(-self.s);return false}); this.dObj.capEv("onmouseup", function(){self.stSc()});
this.dObj.capEv("onmouseout", function(){self.stSc()}); this.dgObj.capEv("onmousedown", function(e){self.sDg(e);return false}); if(ie) this.dgObj.capEv("ondragstart", function(){return false});
}
sObj.prototype.sDg = function(e){this.dSM = getYs(e); this.dSO = this.dgObj.getTop(); var self = this; document.capEv("onmousemove", function(e){self.drag(e)}); document.capEv("onmouseup", function(){self.stD()});}
sObj.prototype.stD = function(){document.relEv("onmousemove"); document.relEv("onmouseup");}
sObj.prototype.drag = function(e){var curM = getYs(e); var mDiff = curM-this.dSM;var dD = this.dSO+mDiff; var dM = (dD<this.tT) ? this.tT : (dD>this.tB) ? this.tB : dD;this.dgObj.setTop(dM); var cM = -(dM-this.tT)*(1/this.sL);this.cObj.setTop(cM);}
sObj.prototype.scroll = function(s){var cM = this.cObj.getTop()+s; var dM = this.tT-Math.round(this.cObj.getTop()*(this.tL/this.cL)); if(cM > 0) cM = 0; else if(cM < -this.cL) cM = -this.cL;if(dM < this.tT) dM = this.tT; else if(dM > this.tB) dM = this.tB;this.cObj.setTop(cM); this.dgObj.setTop(dM); this.sT = window.setTimeout(this.obj+".scroll("+s+")",25);}
sObj.prototype.stSc = function(){if(this.sT) window.clearTimeout(this.sT); this.sT = null;}
sObj.prototype.sJmp = function(e){ var curM = getYs(e); var dD = curM-(this.dH/2);var dM = (dD<this.tT) ? this.tT : (dD>this.tB) ? this.tB : dD;this.dgObj.setTop(dM); var cM = -(dM-this.tT)*(1/this.sL); this.cObj.setTop(cM);}
window.onload = function(){scroller = new sObj(15,"track","up","down","drag","container","content");};
</SCRIPT>
<STYLE type=text/css>#content P {
PADDING-RIGHT: 10px; PADDING-LEFT: 10px; PADDING-BOTTOM: 0px; FONT: 11px Verdana, Arial, Helvetica, sans-serif; PADDING-TOP: 10px
}
</STYLE>
</HEAD>
<BODY>
<DIV id=up
style="BACKGROUND: #none; LEFT: 310px; WIDTH: 18px; POSITION: absolute; TOP: 102px; HEIGHT: 18px"><IMG
height=21 alt=down src="fleche1.gif" width=15></DIV>
<DIV id=track
style="BACKGROUND: #none; LEFT: 310px; WIDTH: 18px; POSITION: absolute; TOP: 118px; HEIGHT: 164px"></DIV>
<DIV id=drag
style="BACKGROUND: #none; LEFT: 312px; WIDTH: 18px; POSITION: absolute; TOP: 118px; HEIGHT: 36px"><IMG
height=82 alt=drag src="bar1.gif" width=12></DIV>
<DIV id=down
style="BACKGROUND: #none; LEFT: 310px; WIDTH: 18px; POSITION: absolute; TOP: 277px; HEIGHT: 18px"><IMG
height=21 alt=down src="fleche2.gif" width=15></DIV>
<DIV id=container
style="BACKGROUND: #none; LEFT: 100px; OVERFLOW: hidden; WIDTH: 200px; POSITION: absolute; TOP: 100px; HEIGHT: 200px">
<DIV id=content style="LEFT: 0px; WIDTH: 200px; POSITION: absolute; TOP: 0px">
<P>Bienvenue sur le site Puissance-Console nous avons fait plusieurs retouches d'abord nous avons fait le design de la v4 ensuite nous avons repris le logo de la v2 et nous l'avons modifié on n'a rajouter plusieurs nouvelles dont des rescentes images de la Revolution, de la Xbox 360 et tous les autres plate-formes qui ce situe dans l'index ensuite nous avons la fameuse barre de défilent d'un mac en gros nous avons entierement refait le site. </P>
<P>Ici nous allons vous parler un peu plus des nouvelles qui conserne le site , alors nous avons un nouveau forum de plate-forme PHPBB qui est un des meilleurs forums sur le net alors gêner vous pas pour vous inscrire ensuite on n'a de nouvelles rubriques qui vont s'y fondre ,tous ce qui concerne la compagnie Sony, alors je vous souhaite une bonne visite.</P></DIV></DIV></BODY></HTML>
|
|
jeudi 29 septembre 2005 à 10:29:09 |
Re : scroll bar avec roll over
Ordinastie
|
Ton texte n'est pas formatté donc illisible, et je doute que le code JS soit de toi, mais au hasard je te dirai de regarder du coté de onmouseover() et onmouseout() de la balise img.
Ordinastie.
|
|
jeudi 29 septembre 2005 à 21:11:00 |
Re : scroll bar avec roll over
Le Zbire
|
en effet ce n'est pas de moi mais c'est plusieurs codes assemblé en un
et il marche a merveille sauf le roll over lol
|
|
mercredi 26 octobre 2005 à 15:43:22 |
Re : scroll bar avec roll over
fadilou
|
Réponse acceptée !
slt!
je me suis permis de recopier le code ci-dessu et de tester, pour vous donner un coup de main je vous propose d'aller visiter cette exemple  [ Lien ] et de télécharger le fichier zip [ Lien ] it's free
Aprés vous me contactez par mail je vous dirais comment faire pour avoir la full free version fadilouseck@yahoo.fr
|
|
Cette discussion est classée dans : function, var, self, el, capev
 Répondre à ce message
 Sujets en rapport avec ce message
scroll bar graphique modifié..comment en avoir plusieurs? [ par Le Zbire ]
voici le codecode:Smart Scroller<script type="text/java
Aide aux cookies [ par Annadrill ]
Bonjour, je réalise un site accessible pour une association et j'aimerais que l'on puisse agrandir ou rapetisser la taille du texte. Mon problème s
problème de return en javascript [ par LordSnotling ]
Bonjour, voilà mon problème, j'ai une fonction en javascript qui devrait me retourner une string or il me retourne le code de la function, j'avoue que
passage d'une liste à une autre [ par maudepasse ]
Bonjour, Je crée un site en CSS et JS, et je suis confrontée à un problème technique : j'ai fait une liste divisée en plusieurs blocs en xhtml, du
Variable retour de function [ par bydouille ]
Bonjour, Je désire faire et utiliser une function qui me renvoie le contenu d'une ligne de tableau (3 cellules) avec comme id : cell-1, cell-2, cell-
Chargement ajax du contenu au clic sur marqueur Google Maps V3 [ par vince240986 ]
Bonjour, Voilà plusieurs jours que je bloque sur la création d'une fonction. L'idée est la suivante, j'ai crée une appli avec une base de données et
mon diapo ne s'affiche pas sans connection [ par hitu ]
Bonjour j'ai réalisé un diaporama mais celui ne s'affiche pas quand je ne suis pas connecté! Merci d'avance voici mon code: [code=as][code=html]
simulateur en javascript [ par mehdimenzli ]
Bonjour tout le monde je viens de creer un site web qui comporte un simulateur, bref , le contexte est d'avoir une image fixe et plusieurs themes lor
L'élément document et le reste... [ par alexflex25 ]
Bonjour, En désespoir de cause je viens vous demander de l'aide une n-ème fois. Soit la class javascript suivante : [code=js] var alerting = Class.cr
Google Maps et Safari [ par peplum37 ]
bonjour, désolé pour la double question, mais je m'étais trompé de forum. j'utilisa la géolocalisation de google maps V3, tout est ok, sauf avec Safa
 Livres en rapport
|
Derniers Blogs
 POUR RAPPEL ! LES SPéCIFICATIONS DES PROTOCOLES OFFICE ET SHAREPOINT SONT DISPONIBLES SUR MSDNPOUR RAPPEL ! LES SPéCIFICATIONS DES PROTOCOLES OFFICE ET SHAREPOINT SONT DISPONIBLES SUR MSDN par neodante
Quelle est le point commun entre : Microsoft il y a 10 ans et Apple aujourd'hui ? Réponse: avoir une politique de protocoles propriétaires et fermés :) Car pour rappel (si si je vous assure c'est important de le rappeler), la majorité des spécifications e...
Cliquez pour lire la suite de l'article par neodante JOYEUX ANNIVERSAIRE NIXJOYEUX ANNIVERSAIRE NIX par ebartsoft
Souhaitons un bon et joyeux anniversaire à notre hôte à tous, Nix.
Je ne le répéterais jamais assez mais sans lui rien ne serait possible. Il défit en permanence les lois de la gravité et comme il le dit si bien, si tu lui fais confiance ça devra...
Cliquez pour lire la suite de l'article par ebartsoft IMAGINE CUP 2012, MAKE A SIGN EN FINALEIMAGINE CUP 2012, MAKE A SIGN EN FINALE par junarnoalg
Voilà qui est fait, la nouvelle est officielle ! L'équipe belge "Make a Sign" va au pays des kangourous défendre son projet dans la catégorie Software Design. http://www.imaginecup.com/CompetitionsContent/Competition/WorldwideFinalists.aspx V...
Cliquez pour lire la suite de l'article par junarnoalg KINECT 1.5 IS OUT !KINECT 1.5 IS OUT ! par Vko
La version 1.5 du Kinect For Microsoft vient tout juste de sortir ! Plein de nouveautés: Tracking de squelette en Near Mode Détection en position assise Détection faciale avec un SDK dédié Documentation et des guideline (enfin) Un out...
Cliquez pour lire la suite de l'article par Vko LES ACTUALITéS DE LA SEMAINE SUR C2I.FR (14 MAI - 20 MAI) LES ACTUALITéS DE LA SEMAINE SUR C2I.FR (14 MAI - 20 MAI) par richardc
Mise à jour des Web API du 14 Mai
Réservez dès maintenant votre journée du 20 juin pour le Windows Azure Dev Camp 2012 à Paris
Mise à jour de Team Foundation Service
MechCommander 2 sur Windows 8
Entity Framework 5 Release Candidate e...
Cliquez pour lire la suite de l'article par richardc
Logiciels
 sDEVIS-FACTURES vlPRO (8.1.0.3)SDEVIS-FACTURES VLPRO (8.1.0.3)sDEVIS-FACTURES vlPRO a été mis au point pour les particuliers, créateurs, entrepreneurs, artisa... Cliquez pour télécharger sDEVIS-FACTURES vlPRO 974 Application Server (12.2.4.6)974 APPLICATION SERVER (12.2.4.6)Développez de puissantes applications dans un environnement de 'cloud computing', clusterisé, séc... Cliquez pour télécharger 974 Application Server vPicture (1.4.2.1)VPICTURE (1.4.2.1)Avec vPicture, hébergez vos images facilement et rapidement.
vPicture est un utilitaire simple, ... Cliquez pour télécharger vPicture Easy-Planning (2.2.1.6)EASY-PLANNING (2.2.1.6)Easy-Planning permet de créer des plannings sous la représentation de diagrammes et est adapté au... Cliquez pour télécharger Easy-Planning COM-BACKUP (2.0)COM-BACKUP (2.0)
COM-BACKUP est un logiciel de sauvegarde qui permet de planifier les sauvegardes de vos dossiers ...
Cliquez pour télécharger COM-BACKUP
|