Slider (curseur variable) élément javascript
Soyez le premier à donner votre avis sur cette source.
Vue 18 982 fois - Téléchargée 1 532 fois
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.
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.
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.
Codes Sources
A voir également
- Curseur javascript
- Javascript slider - Meilleures réponses
- Slider javascript - Meilleures réponses
- Javascript : Curseur viseur! - CodeS SourceS - Guide
- Javascript : Ajouter du texte a la position du curseur dans un textarea - CodeS SourceS - Guide
- Javascript : Ajout d'un texte au niveau du curseur (ie/mozilla) - CodeS SourceS - Guide
- Javascript : Curseur dans textarea - CodeS SourceS - Guide
- Javascript : Curseur dynamique - CodeS SourceS - Guide
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.
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"
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é.
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.
@+
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.
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.