Slider (curseur variable) élément javascript

Soyez le premier à donner votre avis sur cette source.

Vue 17 445 fois - Téléchargée 1 440 fois

Télécharger le projet
Commenter

Description

Cette source sert à intégrer un Slider dans vos pages Web. Qu'est-ce qu'un slider ? C'est un élément qui permet de choisir une valeur comprises entre deux nombre en déplaçant un curseur sur une piste. Comme lorsque vous modifiez le niveau du son sous Windows.

Le Slider peut être utilisé de deux façons, soit vous l'utilisez dynamiquement en utilisant la fonction CallBack, soit vous l'utilisez en récupérant sa valeur sur un retour de formulaire.

Vous pouvez ajouter des Sliders Horizontaux ou Verticaux.

Source / Exemple : 


<html>
<head>
<title>Slider JavaScript</title>

<link type="text/css" rel="stylesheet" href="CSS/slider.css" />
<script type="text/javascript" src="JS/slider.js"></script>

</head>

<body onmousemove="move_mouse_cursor(event)" onmouseup="mouseup_slider()">

<div id="monSlider"></div>

<script type="text/javascript">
init_slider('monSlider',0,0,100,75,150,'');
</script>

</body>
</html>

Conclusion :


Le Script fonctionne parfaitement sous Internet Explorer 6.0 et sous Firefox 3.0 avec Windows Xp, je remercie ceux qui pourront tester sous d'autres navigateurs et autre systèmes d'exploitation.

J'ai ajouter deux fichiers dans le zip afin de tester, test.html et test.js, ce n'est qu'a titre démonstratif.
Télécharger le projet

Codes Sources

A voir également

Ajouter un commentaire

Commentaires

Signaler
cs_kgilbert
Messages postés
17
Date d'inscription
dimanche 17 août 2008
Statut
Membre
Dernière intervention
31 janvier 2018
 -
J'ai faite cette source pour m'amuser et oui elle date ;)
Je vais peut-être la refaire un de ces jour. Tu peux utiliser les sliders de JQuery, ils sont très bien fait et très faciles à modifier.
Signaler
cs_brimston
Messages postés
1
Date d'inscription
mardi 10 février 2009
Statut
Membre
Dernière intervention
27 mai 2010
 -
joli script dans l'ensemble, je sais qu'il date un peu, et j'espère que quelqu'un pourra m'aider.
j'ai plus ou moins réussis a l'intégrer dans mon propre script, mais j'aurais besoins que le curseur s'aligne a une valeur contenu dans un

l'idéale serait sur une fonction activé avec "onkeyup='fonction'" que j'utilise déjà pour autrechose, comme ça je les regroupe.

j'ai récupéré ton scripte exemple test.js, j'en ai gardé les fonctions "rgb2hex" et "update_background"
Signaler
itapirica
Messages postés
2
Date d'inscription
samedi 14 août 2004
Statut
Membre
Dernière intervention
27 décembre 2008
 -
Merci mille fois pour ton script que je cherchais depuis longtemps.
Seulement, je suis plus que novice en J.S.
Peux-tu m'aider pour créer une page où les sliders afficheraient et cacheraient
des div ?
Je te fais un message privé.
Signaler
cs_kgilbert
Messages postés
17
Date d'inscription
dimanche 17 août 2008
Statut
Membre
Dernière intervention
31 janvier 2018
 -
Bonjour,
L'inclusion dans une table ne porte pas problème de mon coté, envoie moi ton code par message privé, s'il s'agit d'un problème du coté de ma source, je posterai une solution ici.

@+
Signaler
berkovits
Messages postés
1
Date d'inscription
jeudi 25 décembre 2003
Statut
Membre
Dernière intervention
3 octobre 2008
 -
Salut Gilbert

J'ai mis les sliders dans une table.
Les curseurs se positionnent n'importe ou dans l'ecran.

(Je suis debutant)
j'ai mis en commentaire /*position:absolute;*/ dans le fichier slider.css, le curseur se place sur le bon slider mais toujours a la position zero et non fonctionnel.
Quelles lignes faut-il modifier pour corriger ce probleme.

Merci.
Afficher les 25 commentaires
S'inscrire maintenant

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.