Scroll bar personalise

Soyez le premier à donner votre avis sur cette source.

Vue 10 300 fois - Téléchargée 1 539 fois

Description

scroll bar personnalise j'ai éviter de mettre des position absolute et d'automatiser le processus de scroll pour que la mise en page soit le plus simple.

Source / Exemple :


var tour=1
var relation
var dde=document.documentElement;
function disableselecte(e){
return false;
}
function enableselecte(e){
return true;
}

function tarto(s) {
if(navigator.vendor){
ddem=document.documentElement.lastChild;
}
else{
ddem=document.documentElement;
}
if(navigator.appName.substring(0,3)=="Net"){
setX = s.clientX+ddem.scrollLeft;
setY = s.clientY+ddem.scrollTop;
}
else{
setX = event.clientX+ddem.scrollLeft;
setY = event.clientY+ddem.scrollTop;
return false;
}
}
if(navigator.appName.substring(0,3)!="Mic"){
dde.addEventListener("mousemove", tarto, false);
}
else{
dde.attachEvent("onmousemove",tarto);
}

function sp(azer,trez){

var ds1 =document.getElementById(azer)
var tbm=document.getElementById(trez)
if(navigator.appName.substring(0,3)=="Mic"){
var rcsb =ds1.childNodes[0]
var ds2=tbm.childNodes[0]
}
else{
var rcsb =ds1.childNodes[1]
var ds2=tbm.childNodes[1]
}
if(tour==2){
if(navigator.appName.substring(0,3)!="Mic"){
document.onmousedown=enableselecte;
}
tour=1;
return false;
}
if(tour==1){
px=setX;
py=setY;
tour=0;
document.onmousedown=disableselecte;
relation=(ds2.offsetWidth-tbm.offsetWidth)/((ds1.offsetWidth)-rcsb.offsetWidth)
}

if(navigator.appName.substring(0,3)=="Mic"){
ds1.style.overflow='hidden';
rcsb.style.marginLeft=parseInt(rcsb.currentStyle.marginLeft)+(setX-px)+'px';
}
else{
rcsb.style.marginLeft=parseInt(getComputedStyle(rcsb, null).getPropertyValue('margin-left'))+(setX-px)+'px';
}
ds2.style.left=ds2.offsetLeft-((setX-px)*relation)+'px'

if(ds2.offsetLeft>150){
ds2.style.left=0+'px'
rcsb.style.marginLeft=0+'px'
tour=2
}
if(ds2.offsetLeft-tbm.offsetWidth<-ds2.offsetWidth-150){
ds2.style.left=-(ds2.offsetWidth)+tbm.offsetWidth+'px'
rcsb.style.marginLeft=(ds1.offsetWidth)-rcsb.offsetWidth+'px'
tour=2
}
px=setX;
py=setY;

setTimeout('sp("'+ds1.id+'","'+tbm.id+'")',10);
}

Conclusion :


apparemment sa marche

Codes Sources

A voir également

Ajouter un commentaire Commentaires
diapoflash Messages postés 2 Date d'inscription mercredi 24 juin 2009 Statut Membre Dernière intervention 28 octobre 2009
29 oct. 2009 à 14:43
Comment le scrollbar peut-il devenir vertical en modifiant ce script?
@karamel Messages postés 1811 Date d'inscription vendredi 9 mai 2008 Statut Modérateur Dernière intervention 4 septembre 2022 145
18 mai 2009 à 20:05
aidez moi
mickaelpfr Messages postés 197 Date d'inscription mardi 18 février 2003 Statut Membre Dernière intervention 29 avril 2009 2
18 mai 2009 à 09:53
Tout a fait daccord avec kimjoa , tropd e variable globale , de plus une autre remarque :
- la lisibilité de ton code , on ne sait absoluement pas a quoi servent les variable et méthode exemple : function sp(azer,trez) je met au défit n'importe qui de me dire ce qu'est censé faire cette fonction ;-)

les bonne pratique sont une chose, la netteté / propreté / compréhension du code ne doit jamais être mise de coté surtout si tu qualifies ta source pour des débutant.

Bon courage ( je te noterais quand tu auras revue ta copie ;) )
cs_Kimjoa Messages postés 262 Date d'inscription vendredi 6 mai 2005 Statut Membre Dernière intervention 19 septembre 2014
17 mai 2009 à 15:17
ok! indenter un code c'est faire des tabulations dans le traitement de tes boucles, conditions ou fonctions , genre :

function tete(){
var tetete='';
}

pour ce qui est de l'objet , cherche à prototype de fonction ...
pour l'encapsulation, ca permet de rendre inaccessible certaine variable(privée) depuis l'extérieur de ton programme , mais surtout ça limite le variables globales, sinon tu peux coder avec un namespace , du genre :

var monprog={
mafonction : function(){}
maprop : ''
}

a++
@karamel Messages postés 1811 Date d'inscription vendredi 9 mai 2008 Statut Modérateur Dernière intervention 4 septembre 2022 145
16 mai 2009 à 20:45
ca en fait du travaille tout ca

bon j'ai quand meme modifier un peut tous ca

j'ai limiter les varibles globales

pour la selection de texte c'etait un oubli

j'ai englobe deux fonctions

diminution du nombre de parametres

encapsuler t'es donné genre :
var sp=function(){var mavaraible=''; return ma fonction}();
ou alors , code en objet ...
-indente ton code, c'est bien plus lisible ...

tous sa me parait interresant mais j'ai pas les connaissances pour tous sa, je m'y interesse
Afficher les 6 commentaires

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.