|
Trouver une ressource
Vous ne trouvez pas de réponse à votre problème ? Alors posez la question dans le forum. Souvenez-vous qu'il n'y a jamais de question bête, mais rester dans l'ignorance parce que l'on n'ose pas poser une question, ça c'est une erreur !
(OBJET) SCROLLBAR
Information sur la source
Description
Permet de créé des scrollbars pour des scripts ou formulaires Son implantation: 1. Incluez le .js <SCRIPT language="Javascript" type="text/javascript" src="scrollbar.js"></SCRIPT> 2. Incluez certains events <BODY onmousemove="deplacement(event);" onmouseup="relache(event);"> 3. instancié vos scrolls / initScrollbar(id,horizontal ou pas,longueur(px),valeur de départ,coord. X,coord. Y); 4. pour pouvoir relier ses changements à vos scripts, modifier la méthode change() - Il est tjrs possible accèder à leur valeur grâce à valeurDe(id du scrollbar) Script a été testé sur Internet Explorer, Mozilla Firefox, Opera
Source
- //Script conçu par Philippe Arteau
- var objCourrant = ""; //Id courrant
- var valeurs = new Array(); //Informations pour chacun des scrollbar
-
- function appuie(event,id)
- {
- objCourrant = id;
- }
- function relache(event)
- {
- objCourrant = "";
- }
- function deplacement(event) //lorsque la souris se déplace
- {
- id = objCourrant;
- if(id != "" )
- {
- if(valeurs[id][1]) //Si le scrollbar est à l'horizontal
- {
- if(navigator.appName.indexOf("Microsoft") != -1)
- x = window.event.clientX;
- else
- x = event.pageX;
-
- if(x < valeurs[id][3]) x=valeurs[id][3];
- if(x >valeurs[id][3]+valeurs[id][2]) x=valeurs[id][3]+valeurs[id][2];
-
- document.getElementById("s"+id).style.left = x;
-
- valeurs[id][0] = x-(valeurs[id][3]);
- }
- else //Si le scrollbar est à la vertical
- {
- if(navigator.appName.indexOf("Microsoft") != -1)
- y = window.event.clientY;
- else
- y = event.pageY;
-
- if(y < valeurs[id][4]) y=valeurs[id][4];
- if(y > valeurs[id][4]+valeurs[id][2]) y=valeurs[id][4]+valeurs[id][2];
-
- document.getElementById("s"+objCourrant).style.top = y;
-
- valeurs[id][0] = y-(valeurs[id][4]);
- }
- change();
- }
- }
-
- function initScrollbar(id,dirHor,longueur,valeurDep,X,Y)
- {
- valeurs[id] = new Array();
- valeurs[id][0] = valeurDep;
- valeurs[id][1] = dirHor;
- valeurs[id][2] = longueur;
- valeurs[id][3] = X;
- valeurs[id][4] = Y;
-
- //Dessin du scrollbar
- //Div de fond
- document.write("<DIV style='background-color:#CCCCCC;position:absolute;top:"+Y+";left:"+X+";")
- if(dirHor)
- document.write("width:"+(longueur+20)+"px;height:30px;");
- else
- document.write("width:30px;height:"+(longueur+20)+"px;");
- document.write("'>");
- document.write("</DIV>");
-
- //Div centrale
- document.write("<DIV style='background-color:#DCDCDC;position:absolute;");
- if(dirHor)
- document.write("top:"+(Y+5)+"px;left:"+X+"px;width:"+(longueur+20)+"px;height:20px;");
- else
- document.write("top:"+Y+"px;left:"+(X+5)+"px;width:20px;height:"+(longueur+20)+"px;");
- document.write("'></DIV>");
-
- //Poigné
- document.write("<DIV id='s"+id+"' style='position:absolute;");
- if(dirHor)
- document.write("top:"+Y+";left:"+(X+valeurDep)+";width:20px;height:30px;");
- else
- document.write("top:"+(Y+valeurDep)+";left:"+X+";width:30px;height:20px;");
- document.write("background-color:#000000;' onmousedown='appuie(event,"+id+")'></DIV>");
- }
-
- function valeurDe(id)
- {
- return valeurs[id][0];
- }
//Script conçu par Philippe Arteau
var objCourrant = ""; //Id courrant
var valeurs = new Array(); //Informations pour chacun des scrollbar
function appuie(event,id)
{
objCourrant = id;
}
function relache(event)
{
objCourrant = "";
}
function deplacement(event) //lorsque la souris se déplace
{
id = objCourrant;
if(id != "" )
{
if(valeurs[id][1]) //Si le scrollbar est à l'horizontal
{
if(navigator.appName.indexOf("Microsoft") != -1)
x = window.event.clientX;
else
x = event.pageX;
if(x < valeurs[id][3]) x=valeurs[id][3];
if(x >valeurs[id][3]+valeurs[id][2]) x=valeurs[id][3]+valeurs[id][2];
document.getElementById("s"+id).style.left = x;
valeurs[id][0] = x-(valeurs[id][3]);
}
else //Si le scrollbar est à la vertical
{
if(navigator.appName.indexOf("Microsoft") != -1)
y = window.event.clientY;
else
y = event.pageY;
if(y < valeurs[id][4]) y=valeurs[id][4];
if(y > valeurs[id][4]+valeurs[id][2]) y=valeurs[id][4]+valeurs[id][2];
document.getElementById("s"+objCourrant).style.top = y;
valeurs[id][0] = y-(valeurs[id][4]);
}
change();
}
}
function initScrollbar(id,dirHor,longueur,valeurDep,X,Y)
{
valeurs[id] = new Array();
valeurs[id][0] = valeurDep;
valeurs[id][1] = dirHor;
valeurs[id][2] = longueur;
valeurs[id][3] = X;
valeurs[id][4] = Y;
//Dessin du scrollbar
//Div de fond
document.write("<DIV style='background-color:#CCCCCC;position:absolute;top:"+Y+";left:"+X+";")
if(dirHor)
document.write("width:"+(longueur+20)+"px;height:30px;");
else
document.write("width:30px;height:"+(longueur+20)+"px;");
document.write("'>");
document.write("</DIV>");
//Div centrale
document.write("<DIV style='background-color:#DCDCDC;position:absolute;");
if(dirHor)
document.write("top:"+(Y+5)+"px;left:"+X+"px;width:"+(longueur+20)+"px;height:20px;");
else
document.write("top:"+Y+"px;left:"+(X+5)+"px;width:20px;height:"+(longueur+20)+"px;");
document.write("'></DIV>");
//Poigné
document.write("<DIV id='s"+id+"' style='position:absolute;");
if(dirHor)
document.write("top:"+Y+";left:"+(X+valeurDep)+";width:20px;height:30px;");
else
document.write("top:"+(Y+valeurDep)+";left:"+X+";width:30px;height:20px;");
document.write("background-color:#000000;' onmousedown='appuie(event,"+id+")'></DIV>");
}
function valeurDe(id)
{
return valeurs[id][0];
}
Conclusion
Deux exemples sont inclus dans le zip exemple1.htm (un très simple) couleurs.htm (qui permet de trouver le code hexadécimal d'une couleur)
Fichier Zip
Pour les "Membres Club", vous pouvez télécharger directement un fichier contenu dans le zip sans télécharger le zip en entier !
Télécharger le zip
Historique
- 20 janvier 2006 06:18:37 :
- ...
Sources du même auteur
Sources de la même categorie
Sources en rapport avec celle ci
Commentaires et avis
Discussions en rapport avec ce code source dans le forum
Pb affichage barre de défilement [ par Jossdoit ]
Bonjoiur, Je travaille actuellement sur Dreamweaver pour faire une page web. Je voudrais changer l'aspect de ma barre de défilement. Pour cela g utili
Pb d'affichage de la barre de défilement [ par Jossdoit ]
Bonjour, Je travaille actuellement sur Dreamweaver pour faire une page web. Je voudrais changer l'aspect de ma barre de défilement. Pour cela g utilis
problème de couleur de scroll barre [ par fogof ]
J'ai paramétré la couleur de mes scroll barre en css dans le body { , mais ces paramètres ne sont pas prient en compte dans ma fra
Affichage barre de defilement [ par Jossdoit ]
Bonjour, Je travaille actuellement sur Dreamweaver pour faire une page web. Je voudrais changer l'aspect de ma barre de défilement. Pour cela g utilis
Barre de sélection de couleur exadecimales [ par sbeex ]
Bonjour, je ne suis pas sur de poster dans la bonne section javascript donc j'en suis désolé pour les modérateurs.Mon problème est le suivant, j'aimer
Scrollbar automatique sous la sourie [ par maxmic ]
Bonjour à tous,je cherche à faire un défilement autimatique sur mon iframe, enfin automatique si ma soris passe sur les fleche en haut et en bas de ma
j'arrive pas a changer la couleur de ma scroll bar !!! :-( [ par kerdesign ]
bonjour !!voila, j'arrive pas a changer la couleur de ma scrollbar, voila les couleur que je voudrais integrer a mon *.htm :<STYLE TYPE="text/css"&
SCROLLBARD [ par Terryest ]
1 : Je voudrais que ma première page soit sans scrollbar.2 : Je voudrais mettre ma page index sans la barre d'état du haut.Sans la scrollbar
scrollbar [ par poloute ]
bonjour,j'ai fais un p'tit site pour mon assos avec un cadre en haut pour les liens et un cadre principal en bas (mainframe).Il y a aussi un fichier c
scrollbar en couleur [ par popow ]
Bonjour, J'ai essayé plusieurs script pour mettre les scrollbar en couleur mais aucun ne marche.Voila par exemple un que j'ai essayé:<sty
|
Téléchargements
Logiciels à télécharger sur le même thème :
|