Bonjour,
je souhaites faire varier la pente d'une droite en déplaçant un curseur.
.... j’arrive à faire afficher un chiffre de 0 à 100 grâce à un curseur ... j’arrive à faire afficher ma droite, .... mais je n'arrive pas à faire les deux dans la même page.
Bref je n'arrives pas à faire passer d'un script à l'autre le contenu de la variable "var droite".

Je vous mets d'abord le script du curseur :
Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
CODE : <HTML>
<!-- curseur --> 
<form action="input-type-range-min-max.php" method="post">
<input type="range" id="champ" name="range" value="5" min="0" max="100" step="5">
</form>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script type="text/javascript"> 
// affichage de la variable
$(function()
        { 
        $("#champ").after('<output></output>');
        $("#champ").live('change', function()
                { var droite = $(this).val(); $('output').text(droite); } ); 
        }); 
</script>
</html>


Puis le script de la droite :
Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<HTML>
<canvas id="moncanevas" width="1200" height="220"></canvas>
<script type="text/javascript"> 
// Variable qui devrait provenir du "curseur" 
var droite = 10 ; 
// Tracé de la droite
canvas = document.getElementById("moncanevas"); 
if (canvas.getContext)
        { context = canvas.getContext('2d'); }
function drawLine()
        { 
        context.strokeStyle='green';
        context.lineCap='round';
        context.lineWidth=4; 
        context.moveTo(310,190);
        context.lineTo(690,droite);
        context.stroke(); 
        } 
drawLine();
</script>
</body>
</html>

J'attends avec impatience toute aide (avec si possible en utilisant des mots pour débutants)
Cordialement
Goups